SPA silent authentication is not working on mobile devices

[tim.eric.schwabe]

Hello, i am currently developing an Application using a React Frontend and a Flask Backend.

My problem is that the silent request of the access token is not working. On desktop devices everything works fine.

I found this post

https://community.auth0.com/t/silent-authorization-not-working-after-login-signup/37114

and followed the instructions to implement rotational refresh tokens. However, the problem that im not able to get a refresh token on mobile devices remains. When i enable cross-site-tracking on the mobile browsers, it does work indeed.

My Auth0 Provider in React looks as follows:

  <Auth0Provider
      domain=".."
      clientId=".."
      redirectUri={process.env.REACT_APP_LOGIN_REDIRECT}
      useRefreshTokens
      cacheLocation="localstorage"
      onRedirectCallback={onRedirectCallback}>
        <App />
  </Auth0Provider>

and my Auth0 Configuration looks as follows:

Does anyone have an idea what still causes the problem ?

Thanks in advance !
Tim

[stephanie.chamblee]

Hi @tim.eric.schwabe,

Have you tried including the audience (and scope) as props in the Auth0Provider?

Related topic: 'Login Required' in Safari - #2 by stephanie.chamblee

[tim.eric.schwabe]

Hello Stephanie,

thanks for your reply. I managed to solve the problem by setting audience and scope in the provider as you stated. Additionally i had to remove the audience from the getAccessTokenSilently function. As stated in the corresponding source code:

• If an audience value is given to this function, the SDK always falls
• back to using an iframe to make the token exchange.

Maybe its helpful to include this in the react tutorial as its quite common for users to use mobile browsers ?

Best,
Tim

[stephanie.chamblee]

I’m glad you were able to resolve the issue, and thank you for the feedback @tim.eric.schwabe!