Auth0-react not getting accessToken on requests

Please include the following information in your post:

  • Which SDK this is regarding: e.g. auth0-react
  • SDK Version: 1.4.0
  • Platform Version: Node v14.15.4
  • Code Snippets/Error Messages/Supporting Details/Screenshots:

I have a client application and a secure API with auth0, both are working perfectly on Chrome.

I was trying to use Safari and Chrome Incognito and I found out that the accessToken that I get from getAccessTokenSilently is not being sent on the requests. Is there some known bug to this? It’s so frustrating because it works in chrome perfectly.

Am I missing something?

1 Like

Hi @gmwill934,

It sounds like you may be running into an issue with blocked third-party cookies. To confirm this, you can set the cacheLocation to localstorage in the Auth0Provider:

ReactDOM.render(
  <Auth0Provider
    domain={config.domain}
    clientId={config.clientId}
    audience={config.audience}
    redirectUri={window.location.origin}
    onRedirectCallback={onRedirectCallback}
    useCookiesForTransactions={true}
    cacheLocation="localstorage" // <- update cache location
  >
    <App />
  </Auth0Provider>,
  document.getElementById("root")
);

There are security considerations regarding storing tokens in local storage which you can read more about here: Token Storage

Alternatively, you can use a Custom Domain so that the cookies won’t be seen as 3rd-party by the browser.

Related FAQ: Why is authentication lost after refreshing my single page application?

I’ll try a custom domain for now, see if that works. :slight_smile:

I just tried a custom domain and the behavior is the same. Any thoughts on this?

    <Auth0Provider
          domain={domain}
          clientId={clientId}
          redirectUri={redirectUri}
          audience={audience}
          cacheLocation='localstorage'
        ></App>
     </Auth0Provider>

Not working on safari or chrome incognito.

Only working on chrome and firefox.

Hm, sorry to hear that! When you call getAccessTokenSilently are you using a different scope or audience from what is in the Auth0Provider? I’ve seen in some cases if the audience/scope is different from what is initialized in Auth0Provider, then silent auth will be required and may fail.

Using the same audience on Auth0Provider and getAccessTokenSilently, I’m currently not passing a scope prop.

So, it’s also not working on chrome for iOS… It seems that it only works for chrome on mac and windows…?

Hi @gmwill934,

In order to troubleshoot this, could you please create a HAR file of the authentication flow and send it to me in a private message (you can send a private message by clicking on my avatar and selecting message)? Thank you!

1 Like

thanks, let me generate that file.

1 Like

I sent you the file as a direct message.