Skip to content

Commit e2bfd4c

Browse files
docs: add Native to Web SSO example to EXAMPLES.md
1 parent ded2fa1 commit e2bfd4c

1 file changed

Lines changed: 59 additions & 0 deletions

File tree

EXAMPLES.md

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,8 @@
1515
- [Access SDK Configuration](#access-sdk-configuration)
1616
- [Multi-Factor Authentication (MFA)](#multi-factor-authentication-mfa)
1717
- [Step-Up Authentication](#step-up-authentication)
18+
- [Native to Web SSO](#native-to-web-sso)
19+
- [Native to Web SSO](#native-to-web-sso)
1820

1921
## Use with a Class Component
2022

@@ -1125,3 +1127,60 @@ export default ProtectedResource;
11251127
11261128
If the popup is blocked, cancelled, or times out, `getAccessTokenSilently` throws `PopupOpenError`, `PopupCancelledError`, or `PopupTimeoutError` respectively. These can be imported from `@auth0/auth0-react`.
11271129
1130+
## Native to Web SSO
1131+
1132+
[Native to Web SSO](https://auth0.com/docs/authenticate/single-sign-on/native-to-web) enables seamless single sign-on when users transition from a native mobile app to a web app. The SDK can automatically extract a session transfer token from the URL and include it in the authorization request.
1133+
1134+
The feature is **disabled by default**. To enable it, set `sessionTransferTokenQueryParamName` on `Auth0Provider` with the name of the query parameter your native app appends to the web app URL:
1135+
1136+
```jsx
1137+
import { Auth0Provider } from '@auth0/auth0-react';
1138+
1139+
function App() {
1140+
return (
1141+
<Auth0Provider
1142+
domain="YOUR_AUTH0_DOMAIN"
1143+
clientId="YOUR_AUTH0_CLIENT_ID"
1144+
authorizationParams={{
1145+
redirect_uri: window.location.origin,
1146+
}}
1147+
sessionTransferTokenQueryParamName="session_transfer_token"
1148+
>
1149+
<MyApp />
1150+
</Auth0Provider>
1151+
);
1152+
}
1153+
```
1154+
1155+
When the web app is opened with `?session_transfer_token=xyz` in the URL, the SDK extracts the token, includes it in the `/authorize` request, and removes it from the URL via `window.history.replaceState()`.
1156+
1157+
### Using a custom parameter name
1158+
1159+
If your native app uses a different query parameter name, configure that name instead. The token is always forwarded to Auth0 as `session_transfer_token` regardless:
1160+
1161+
```jsx
1162+
<Auth0Provider
1163+
domain="YOUR_AUTH0_DOMAIN"
1164+
clientId="YOUR_AUTH0_CLIENT_ID"
1165+
authorizationParams={{
1166+
redirect_uri: window.location.origin,
1167+
}}
1168+
sessionTransferTokenQueryParamName="stt"
1169+
>
1170+
<MyApp />
1171+
</Auth0Provider>
1172+
```
1173+
1174+
### Manually providing the session transfer token
1175+
1176+
You can pass the token directly via `authorizationParams`. This takes precedence over automatic URL detection:
1177+
1178+
```jsx
1179+
const { loginWithRedirect } = useAuth0();
1180+
1181+
await loginWithRedirect({
1182+
authorizationParams: {
1183+
session_transfer_token: 'YOUR_SESSION_TRANSFER_TOKEN',
1184+
},
1185+
});
1186+
```

0 commit comments

Comments
 (0)