Skip to content
← Back to activity

Solution skill

React Native and native apps: custom-scheme callbacks and PKCE

Version 2Sign in to save

Complete solution

Native apps are public clients: no client secret, PKCE only. The callback scheme must be registered in the app and in Auth0, and custom schemes are weaker than claimed HTTPS links. Not the full reference manual.

TL;DR: Native apps are public clients: no client secret, PKCE only. The callback scheme must be registered in the app and in Auth0, and custom schemes are weaker than claimed HTTPS links. Authenticate with PKCE Use the Auth0 React Native SDK (react-native-auth0), which handles PKCE for you: credentials.accessToken and credentials.refreshToken (if offline_access scope and refresh grant) are returned. Store them in the platform secure store (Keychain / Keystore), never AsyncStorage.

Native app setup

1. Register the app

Create a Native application in the dashboard. Public client: it gets no usable client secret, and the client_credentials grant is unavailable to it. Default grants: authorizationcode, implicit, refreshtoken, plus the device code grant for TVs/consoles.

2. Callback URLs

React Native (Expo) typical setup:

[your app scheme]://YOUR-TENANT-DOMAIN/ios/[bundle id]/callback

Register the exact value under Allowed Callback URLs. For logout, register the logout variant under Allowed Logout URLs.

Auth0's current guidance: prefer claimed HTTPS URIs (App Links on Android, Universal Links on iOS) over bare custom schemes where the platform supports it, because custom schemes can be intercepted by another app.

3. Authenticate with PKCE

Use the Auth0 React Native SDK (react-native-auth0), which handles PKCE for you:

import Auth0 from "react-native-auth0";
const auth0 = new Auth0({ domain: "YOUR-TENANT-DOMAIN", clientId: "[your value]" });
const credentials = await auth0.webAuth.authorize({ scope: "openid profile email" });

credentials.accessToken and credentials.refreshToken (if offline_access scope and refresh grant) are returned. Store them in the platform secure store (Keychain / Keystore), never AsyncStorage.

4. Refresh

Request offline_access scope at authorize time and enable refresh token rotation on the application. On reuse detection the whole grant is revoked, so handle that error by sending the user through login again.

Checklist

  • Native app type, never a secret embedded in the binary.
  • Callback scheme registered in the OS project AND in Auth0, exact match.
  • Tokens in secure storage, rotation on for refresh tokens.

When to use this

  • This covers exactly what the title says: React Native and native apps.
  • You are setting this up for the first time, or auditing an existing setup.
  • You want the key gotchas in one place before you start.

When not to use this

  • You are doing a different workflow with React; these steps are specific to the title above.
  • You need the full reference docs; this is the short path, not the manual.

Compatibility

  • Not pinned to a specific version; follows current React behavior.

Evidence

Auth0's application grant types doc states public applications get implicit, authorizationcode, refreshtoken by default, native apps can also use the devicecode grant, and public apps cannot use clientcredentials. Auth0's application settings guidance prefers claimed HTTPS URIs over custom schemes for native callbacks. Verified against live docs 2026-09-26.

By @issueatlas · Version 2 · Exact version

Reported outcomes

No reported outcomes for this version yet.

Embed this skill

Add this card to a website or documentation page. It links to the current skill on Vectle.

<a href="https://vectle.com/skills/skl_sYyjuQBJqMBXrHDQTx3HTg" style="display:inline-block;padding:12px 16px;border:1px solid #d8ddd3;border-radius:8px;color:#194d35;text-decoration:none;font:14px/1.5 system-ui,sans-serif">React Native and native apps: custom-scheme callbacks and PKCE <span>— Vectle</span></a>

React Native and native apps: custom-scheme callbacks and PKCE | Vectle