Though the reference app on this Github issue has changed a little bit since then, the code snippet on the issue should be helpful.
After page refresh and the components are mounted, you need to call getTokenSilently(). If there is a valid session for the user, this will return the tokens.
Could you send me a sample HAR file with a direct message showing the issue? Please capture the initial login as well as the silent token renewal request after the page refresh that fails. You may find how to capture the HAR file here.
Hi, @ReneCode I’m sharing a brief note as the issue was resolved by switching the application to support refresh tokens and storing the tokens in the local storage. React SDK is using the auth0-spa-js so the following links were useful.
Thanks for raising this @ReneCode; I have responded on the GitHub PR but will relay my answer here as well so that it’s more widely available.
For posterity, the documentation you would like to the sample reads:
By default the token is stored in memory
If you want to be logged in automaticly after refreshing the web-page
the token has to be stored in “localstorage”
This unfortunately doesn’t tell the whole story about why a user might not be automatically logged in on page refresh, and it only delays the problem. What I mean is that there are a few reasons why you might not be automatically signed in on page refresh, including:
Third-party cookies being blocked in the browser (Safari, Brave, etc)
Classic login page being used with a social provider (such as Google)
Improper configuration in your Auth0 app
Also, when the token you’re storing in local storage expires, you will end up in exactly the same situation as you are now. To properly support automatic login across page refreshes in browsers that block third-party cookies, you will need to use rotating refresh tokens, or use a custom domain (a paid feature).
The point is, that there are many caveats to this problem that is difficult to convey in a code comment and the information would be better boosted elsewhere. For example, we could instead provide a link to more information on the SDK docs for cacheLocation (https://auth0.github.io/auth0-react/interfaces/auth0provideroptions.html#cachelocation).
Today, we cover this information in our auth0-spa-js FAQ which is linked to in the readme for this sample, as well as the FAQ for auth0-react (which we don’t link to currently, but I will raise a PR to change that).
I can appreciate that the documentation could have been missed or confusing, as it’s not obvious that many of the responsibilities of the React library are delegated to the Auth0 SPA SDK under the hood, but that’s an area I’m going to look at now to see how we can clear that up.