If user clicks on browser back after login, SDK displays error in Login callback page

[CauveryRaja25]

Describe the bug

When a user clicks on browser back after login, below error is displayed in login/callback page

AuthSdkError: Could not load PKCE codeVerifier from storage. This may indicate the auth flow has already completed or multiple auth flows are executing concurrently.

Approach: okta-hosted-login

Reproduction Steps?

Consider if the user logs in as mentioned below

Navigates from A -> B (okta login page/ login callback) -> C When back button is clicked from page C

Current behaviour: Navigates to page B - login callback page displaying the above error

Expected behaviour: Since user is already logged in, skip page B and directly route to page A.

SDK Versions

Okta React SDK Version: "6.7.0"

Additional Information

Though we are using router.replace in restoreOriginalUri callback, its just pushing (not replacing login/callback) into history

[denysoblohin-okta]

This error message on login callback page makes sense This may indicate the auth flow has already completed ..

You can use your own HOC wrapper around LoginCallback like this:

import { useOktaAuth, LoginCallback } from '@okta/okta-react';

const MyLoginCallback = (props) => {
  const { authState } = useOktaAuth();
  if (!authState.isAuthenticated) {
    return <LoginCallback {...props} />;
  } else {
    return "Auth flow has been already completed";
  }
}

[CauveryRaja25]

Thanks for responding. This approach will just display the above message instead of the error. But we don't want our users to see this page(login callback) since they've already logged in.

When user clicks browser back from Dashboard after login, currently the flow is Home <- Login Callback <- Dashboard Expected: Home <- Dashboard

Ideally the login callback should not be in history, it should be replaced but it isn't. Though we are using history.replace(), its not replacing the login callback

Note: We are able to reproduce the same behaviour in Okta React Sample

[jaredperreault-okta]

Can you provide the output of npx envinfo --npmPackages '{@okta/*,react*}' --browsers?

[denysoblohin-okta]

Actually, the history is: Home -> Okta Login Page -> Login Callback >> Dashboard Login Callback is replaced by Dashboard correctly if you use restoreOriginalUri. When you go back in history, you go to Okta Login Page which redirects you to new Login Callback page with new code in url. You can debug this with

  oktaAuth.token.parseFromUrl._getHistory = () => {
    return {
      replaceState: (_: unknown, name: string, url: string) => {
        debugger
        history.replace(url);
      }
    } as any;
  };

AFAIK you can't remove Okta Login Page from the history

[CauveryRaja25]

Thanks for confirming. In that case, we'll add some user-friendly content in the Login Callback page for now. Feel free to let us know if this behaviour can be addressed/improved in the future.