Application reloads on token refresh with React OKTA sign in widget

[amit70]

okta-react: 3.0.10
okta-signin-widget: 3.9.2

Currently application is reloaded when it's trying to get the refresh access token, hence losing all the changes which is sent to the backend server. The app used to silently refresh and send the updated token, but recently its having this refresh issue.

I'm using .getAccessToken() method, which returns the promise, and if it detects a token has expired, it will refresh and return a new one. Reference: https://devforum.okta.com/t/do-i-need-to-manually-refresh-tokens-in-my-spa/8064

I have also enabled EA token rotation feature, but no luck.
https://developer.okta.com/docs/guides/refresh-tokens/refresh-token-rotation/

Any help would be appreciated.

[ey52fpv]

Can someone provide a path for the resolution?

[paulsonantajo]

Same issue is there in,
"@okta/okta-auth-js": "^5.2.0",
"@okta/okta-react": "^6.0.0"

[ey52fpv]

As a workaround, I'm degraded to okta-react:"3.0.0" and okta-signin-widget:"3.9.0" and seems to work.

[crisrauber]

Same issue
"@okta/okta-auth-js": "^5.2.1",
"@okta/okta-react": "^6.0.0"

Anyone find a solution ?

[crisrauber]

Hey i just updated my @okta/okta-auth-js to the latest version (5.5.0), and this fixed the issue.

[stevenmckinnon]

I'm facing the same issue even when updated to 5.5.0

"@okta/okta-auth-js": "5.5.0",
"@okta/okta-react": "6.2.0",

Note: I'm not using the sign in widget, rather just the full okta login page

[lacsaba]

I have the same issue, re-render starts at the <Security /> component and forces all children components to re-render.

"@okta/okta-auth-js": "^6.3.0",
"@okta/okta-react": "^6.4.3",

Why did it re-render?

Hook 1

Note: I'm not using the sign in widget, rather just the full okta login page

[IbrahimOmar91]

I'm having the same issue even with versions suggested before by @crisrauber

Versions:

"@okta/okta-auth-js": "^5.5.0",
"@okta/okta-react": "^6.0.0",

configuration:

const oktaConfig = {
  issuer: "IDP_ISSUER",
  clientId: "CLIENT_ID",
  redirectUri: origin + "/implicit/callback",
  scopes: ["openid", "email", "profile", "groups"],
  tokenManager: {
      autoRenew: true,
      expireEarlySeconds: 60,
};

[chinanderm]

Not sure if this is related, but occasionally I'll get routed to my login route in the middle of an active session. Haven't paid attention to any token refresh messages in dev tools, but this is certainly a poor user experience.

[saymow]

@chinanderm the same is happening with me, have you found a fix for this?

[chinanderm]

@saymow Unfortunately no. I'm planning on setting up a test scenario with a bunch of logging to hopefully capture an occurrence of the event to see what happens. I can follow up once I've done that.

[saymow]

@chinanderm i would be glad. I'm really thinking on removing this wrapper and doing the auth stuff myself.

[cmonteiro128]

Anyone find any solutions to this?

[jaredperreault-okta]

@cmonteiro128 Do you observe this same behavior with a sample app? https://github.com/okta/okta-react/tree/master/samples

[cmonteiro128]

Hello,

We ended up finding the bug in our App. We had a wrapper around Okta's SecureComponent, and in that file we were violating the react/no-unstable-nested-components rule, which caused React to dump its state. Fixing this solved our issue

[saymow]

We managed to figure out what was our problem, it was really silly actualy:

When configuring this, remember to add the offline_access scope on the app okta settings and configure the refresh tokens. It seems that the wrapper fallbacks to the "basic" auth method when you dont have theses thing configured.

[chinanderm]

When configuring this, remember to add the offline_access scope on the app okta settings and configure the refresh tokens. It seems that the wrapper fallbacks to the "basic" auth method when you dont have theses thing configured.

To add to/be more explicit about this:

1. The application (in Okta dashboard) needs to have the Refresh Token setting enabled
2. In Security > API, ensure offline_access is an allowed scope

Thanks @saymow