Magic OAuth for React Native

Magic OAuth for React Native


Social Logins work as an extension to Magic SDK. To add Social Login to your Magic integration, follow these steps to install the OAuth Extension:

  • In your project, run npm install @magic-sdk/react-native @magic-ext/react-native-oauth
  • Create your Magic SDK instance with the OAuth extension:
import { Magic } from '@magic-sdk/react-native';
import { OAuthExtension } from '@magic-ext/react-native-oauth';

const magic = new Magic('YOUR_API_KEY', {
  extensions: [new OAuthExtension()],
  • Start the OAuth 2.0 login flow:
const result = await magic.oauth.loginWithPopup({
  provider: '...' /* 'google', 'facebook', 'apple', or 'github' */,
  redirectURI: 'testapp://demo/your/oauth/callback',
  scope: ['user:email'], /* optional */

// Result has the following interface
interface OAuthRedirectResult {
  oauth: {
    provider: string;
    scope: string[];
    accessToken: string;
    userHandle: string;

    // `userInfo` contains the OpenID Connect profile information
    // about the user. The schema of this object should match the
    // OpenID spec, except that fields are `camelCased` instead
    // of `snake_cased`.
    // The presence of some fields may differ depending on the
    // specific OAuth provider and the user's own privacy settings.
    // See:

    userInfo: ...;

  magic: {
    idToken: string;
    userMetadata: MagicUserMetadata;

App linking guide: Expo Linking

Server-side SDKs?

Integrate Magic with your existing backend.

Magic OAuth for React Native