Using `react-oidc-context` ho do we remove the `grant_id` and `code` from the URL post login?

Question

I have a SPA, which is protected using the PKCE authentication flow via the JavaScript library react-oidc-context.

Once a user successfully authenticates, they are redirected back to the desired URL, except that react-oidc-context is adding two query string parameters, grant_id and code. Below is an example of the URL users are redirected to after successfully authenticating:

https://spa.example.com/?grant_id=239020443&code=2930293029r4jiojokfjdfjsdof30940403433

I'm a bit OCD, and so these two additional query string parameters are bothering me. I understand during the PKCE authentication flow these query string parameters are needed. But once the user is successfully authenticated, I would like the user to be sent to the root URL without the OIDC-related query strings appended on the URL. For example:

https://spa.example.com

How can I configure react-oidc-context to remove the grant_id and code from the URL post-authentication?

Answer 1

It is already mentioned on the official documentation here https://github.com/authts/react-oidc-context you need to provide onSigninCallback in your oidcConfig.

const onSigninCallback = (_user: User | void): void => {
      window.history.replaceState(
          {},
          document.title,
          window.location.pathname
      )
}

You can use it to trim the query params returned by identity provider.