Refresh Token interaction with Access Tokens

I am using the Auth0 SPA JavaScript SDK with refresh tokens configured including refresh token expiration and rotation for security measures.

My flow is functional and utilizes the loginWithRedirect and getTokenSilently methods exposed by the SDK but one thing I have not been able to figure out is if (I or the SDK) are responsible for using the refresh tokens to obtain new access tokens?

From reading related community posts and information online, it sounds like that responsibility used to be on the developer in older versions, however verbiage throughout documentation for the current SDK seems to imply that the SDK should automatically issue a request to get new access tokens before it expires?

In any case I have noticed that changing the TTL for my API’s access token seems to control when users are forced to login again. Therefore it seems that my refresh tokens are not actually being utilized as their TTL’s are much longer than the access token’s.

For some additional context I am configuring the Auth0Client with a cacheLocation: 'localstorage' and authorizationParams.scope: ‘openid profile email offline_access’ and my package version is “@auth0/auth0-spa-js": “2.5.0”.

Overall I am just trying to understand if I am missing something here conceptually or in my own auth flow, thank you.

Hi @kbrown84,

Welcome to the Auth0m Community!

You’re right about the information that you have researched online, as the latest SPA SDKs can use the refresh tokens automatically. But in oder for that to work properly within the integration of your app with the SDK, you will have to configure the Auth0 Client to include the useRefreshTokens: true as well, such as:

const auth0 = await createAuth0Client({
  domain: '<AUTH0_DOMAIN>',
  clientId: '<AUTH0_CLIENT_ID>',
  useRefreshTokens: true,
  authorizationParams: {
    redirect_uri: '<MY_CALLBACK_URL>',
    audience: 'https://your_audience',
    scope: 'openid profile email offline_access'
  }
});

This Knowledge Base Article - How to Use Refresh Tokens in a SPA will provide a step-by-step documentation of the process of enabling refresh tokens.

Additionally I would also recommend enabling the useRefreshTokensFallback: true since the SDK will still fall back to iframe-based silent authentication using the Auth0 session if the Refresh Token exchange fails, generating an extended session of the user even after the expiration of the Refresh Token’s absolute time.

Hope this helps!
Best regards,
Remus

1 Like

Thank you for the follow-up! I can confirm I was also previously using useRefreshTokens: true but I also included useRefreshTokensFallback: true and went through the article you linked and can confirm that each step is implemented and accounted for.

I am still running into the same issue it seems. For easier testing I set my API’s Maximum access token lifetime to 120 secs and the implicit / hybrid flow lifetime to half of that (though I’m not sure if that one is relevant in my case?).

What I’m seeing is that if I refresh my home page after 2 minutes and while monitoring my network tab, there is a request ending with /oauth/token returning a 403 and immediately after I get returned to my login page.

That token request payload includes the following:
client_id: <my app's client-id>
grant_type: refresh_token
refresh_token: <a refresh token>
redirect_uri: <my redirect url>

Is this expected or is this illustrating the refresh token request failing to get a valid access token upon the access token expiring?