Web (Next.js) to Mobile (React Native) SSO via Deep Link

We have an existing Next.js web application using nextjs-auth0 (v4) and a React Native mobile app using react-native-auth0 (v5.4.0). Users are already authenticated on the web app. When they tap an “Open in App” link, we want them to land in the mobile app already logged in without the need to go through the auth0 login screen again.

Is Custom Token Exchange the recommended approach for Web to Native SSO? Or is there a different way to implement this?

Our env is:

  • nextjs-auth0 v4.16.0

  • react-native-auth0 v5.4.0 (React Native with iOS (Universal Links) and Android (App Links) for deep link verification)

Thank you.

Hi @medev

Welcome to the Auth0 Community!

I am sorry about the delayed response to your question!

Custom Token Exchange would not be a recommended approach for Web to Native SSO since it would require you to pass a valid token from your Next.js web app to your React Native app via the deep link URL. Even with secure Universal/App Links, passing sensitive bearer tokens in URLs is highly discouraged because URLs can be intercepted by device logs, analytics SDKs, or browser histories.

Otherwise, when you use @auth0/nextjs-auth0 on a mobile browser (like Safari on iOS or Chrome on Android), Auth0 sets an SSO session cookie on your Auth0 tenant domain, if your React Native app opens via the deep link and calls the react-native-auth0 authorize() method, it does not open a standalone, isolated WebView.

By default, it opens an ASWebAuthenticationSession on iOS and a Chrome Custom Tab on Android. Crucially, these native components share the cookie jar with the device’s default system browser.

To implement Web-to-Native SSO, you don’t actually need any complex token exchange or custom endpoints since you can rely on the standard OpenID Connect behavior. The flow would be something like this:

  • User Taps Link
  • Deep Link Intercept
  • Trigger Auth

As an example, the code would look something like this:

import { useAuth0 } from 'react-native-auth0';

// Inside your component/hook that handles the deep link
const { authorize, user } = useAuth0();

const handleDeepLink = async () => {
  if (!user) {
    try {
      await authorize(); 
    } catch (error) {
      console.error("SSO Login failed", error);
    }
  }
};

For this to work without any issues, you must ensure that Ephemeral Sessions are disabled in your React Native app.

Otherwise, you can read more about Native to Web SSO here.

If you have any other questions, let me know!

Kind Regards,
Nik

1 Like

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.