Skip to main content

React Native SDK

The beta @guardhouse/react-native package provides native browser login with Authorization Code and PKCE, secure token storage, session restoration, and an optional passkey adapter.

Install

npm install @guardhouse/react-native react-native-keychain react-native-inappbrowser-reborn

Configure the requested OpenID scopes and API audience for your application. Override the revocation endpoint with the current server path, /connect/revoke.

The default browser adapter uses react-native-inappbrowser-reborn. Refresh tokens use iOS Keychain or Android Keystore through react-native-keychain; there is no AsyncStorage fallback.

Login And Restore The Session

const result = await client.loginWithBrowser();
const restored = await client.restoreSession();
const accessToken = await client.getAccessToken();

Call restoreSession() during app startup before deciding whether to show authenticated UI. Access-token retrieval automatically refreshes when a stored refresh token is available.

Logout

await client.logout({
revoke: true,
revokeRefreshToken: true,
});

Set the client's revocation endpoint to /connect/revoke when logout should revoke tokens.

Passkeys

Users can use a passkey inside Guardhouse's hosted browser login when passkeys are enabled for the tenant. That works through loginWithBrowser() without a native passkey adapter.

Headless passkey support

Hosted-browser passkeys are supported. Do not enable the beta SDK's headless passkey method unless your Guardhouse deployment explicitly supports that integration.

Main Client Methods

MethodPurpose
loginWithBrowser()Start native browser Authorization Code with PKCE
registerWithBrowser()Start the hosted registration flow
restoreSession()Restore and refresh a saved session
getSession()Return the current normalized session
getAccessToken()Return a valid token, optionally refreshing it
refreshToken()Explicitly refresh from secure storage
logout()Clear local state and optionally revoke tokens

Errors

Catch the exported GuardhouseAuthError, GuardhouseNetworkError, GuardhouseStorageError, and GuardhouseConfigurationError classes. Do not display raw protocol or storage errors directly to users.

This beta package does not expose the System API and must not receive a System API client secret.

The package supports React 18+, React Native 0.70+, and Node.js 18+ for its toolchain. On iOS, run pod install after installing native modules.

Register The Redirect URI

Create a public/native client in Guardhouse and register the same deep-link URI used by the app, for example com.example.app://callback.

  • iOS: add com.example.app under CFBundleURLTypes in Info.plist.
  • Android: add a browsable VIEW intent filter with scheme com.example.app and host callback. Set the main activity launch mode to singleTask.

Redirect URI comparison is exact. Scheme, host, path, case, and trailing slash must match the client registration.

Create The Client

Use a public client ID, the registered deep-link redirect URI, the scopes your app needs, and the audience of the API it calls. Do not configure a client secret in mobile code.

import { GuardhouseClient } from '@guardhouse/react-native';

const client = new GuardhouseClient({
authority: 'https://your-tenant.guardhouse.cloud',
clientId: 'YOUR_NATIVE_CLIENT_ID',
redirectUri: 'com.example.app://callback',
});