# Using Your Own Authentication

Openfort integrates with external authentication providers so you can keep your existing login while still issuing embedded wallets for users.

## Supported Providers

Openfort has built-in support for these third-party authentication platforms:

| Provider | Configuration |
|----------|---------------|
| [**Firebase**](/docs/configuration/external-auth/firebase) | `ThirdPartyOAuthProvider.Firebase` |
| [**Better-Auth**](/docs/configuration/external-auth/better-auth) | `ThirdPartyOAuthProvider.BetterAuth` |
| [**Supabase**](/docs/configuration/external-auth/supabase) | `ThirdPartyOAuthProvider.Supabase` |
| [**PlayFab**](/docs/configuration/external-auth/playfab) | `ThirdPartyOAuthProvider.Playfab` |
| [**AccelByte**](/docs/configuration/external-auth/accelbyte) | `ThirdPartyOAuthProvider.Accelbyte` |
| [**LootLocker**](/docs/configuration/external-auth/lootlocker) | `ThirdPartyOAuthProvider.Lootlocker` |
| [**Custom OIDC**](/docs/configuration/custom-auth/oidc-token) | `ThirdPartyOAuthProvider.Oidc` |
| [**Custom Auth**](/docs/configuration/custom-auth/auth-token) | `ThirdPartyOAuthProvider.Custom` |

## Setup Steps

### 1. Configure Your Provider in the Dashboard

Before integrating, configure your authentication provider in the [Openfort Dashboard → Providers](https://dashboard.openfort.io/providers):

* **For built-in providers** (Firebase, Supabase, and others): Add your provider's Project ID or credentials
* **For OIDC providers** (Auth0, Cognito, and others): Provide your JWKS URL and audience (`aud`) value
* **For custom auth servers**: Set up a verification endpoint and authentication headers

[View detailed provider setup guides →](/docs/configuration/external-auth)

### 2. Set up the `thirdPartyAuth` prop in `OpenfortProvider`

Wrap your React Native app with `OpenfortProvider` and specify your authentication provider's `getAccessToken` function.
Here's an example using Firebase:

:::code-group

```tsx [Providers.tsx]
import React from "react";
import { OpenfortProvider, ThirdPartyOAuthProvider } from "@openfort/react-native";

// Firebase setup for React Native [!code focus]
import "@react-native-firebase/app"; // [!code focus]
import auth from "@react-native-firebase/auth"; // [!code focus]

export function Providers({ children }: { children: React.ReactNode }) {

  // Firebase's specific getAccessToken function [!code focus]
  const firebaseGetAccessToken = async () => { // [!code focus]
    const token = await auth().currentUser?.getIdToken(/* forceRefresh */ false); // [!code focus]
    return token ?? null; // [!code focus]
  }; // [!code focus]

  return (
    <OpenfortProvider // [!code focus]
      publishableKey={"YOUR_OPENFORT_PUBLISHABLE_KEY"} // [!code focus]
      
      thirdPartyAuth={{ // [!code focus]
        provider: ThirdPartyOAuthProvider.Firebase, // or Oidc, Custom  // [!code focus]
        getAccessToken: firebaseGetAccessToken,  // [!code focus]
      }}  // [!code focus]

      walletConfig={{ // [!code focus]
        shieldPublishableKey: "YOUR_SHIELD_PUBLISHABLE_KEY", // [!code focus]
        recoveryMethod: 'automatic', // or 'password' // [!code focus]
        createEncryptedSessionEndpoint: "https://your-backend.com/api/protected-create-encryption-session", // Required for automatic recovery // [!code focus]
      }} // [!code focus]
    >
      {children}
    </OpenfortProvider>
  );
}
```

```tsx [App.tsx]
import { Providers } from "./Providers";
import MainApp from "./MainApp";

export default function App() {
  return (
    <Providers>
      <MainApp />
    </Providers>
  );
}
```

:::

### 3. Sync Authentication State

In your main app, synchronize the third-party authentication state with Openfort's.
Here's an example using Firebase:

```tsx [MainApp.tsx]
import { useEffect } from "react";
import { useUser, useSignOut } from "@openfort/react-native";
import auth from "@react-native-firebase/auth";

export default function MainApp() {
  const { getAccessToken } = useUser();  // [!code focus]
  const { signOut: signOutOpenfort } = useSignOut();  // [!code focus]

  // Sync Firebase's authentication state with Openfort's [!code focus]
  useEffect(() => {  // [!code focus]
    auth().onAuthStateChanged(user => {  // [!code focus]
      if (user) {  // [!code focus]
        getAccessToken();  // [!code focus]
      } else {  // [!code focus]
        signOutOpenfort();  // [!code focus]
      }  // [!code focus]
    });  // [!code focus]
  }, [getAccessToken, signOutOpenfort]);  // [!code focus]

  return (
    <>
      {/* Your app content */}
    </>
  );
}
```

## How It Works

1. **User authenticates** with your provider (Firebase, Auth0, or others)
2. **`getAccessToken()` is called** – exchanges your provider's token for an Openfort session
3. **Openfort verifies the token** and retrieves the user's session key
4. **An embedded wallet is linked** to the user's identifier
5. **User can now sign transactions** with their embedded wallet

## Configuration Guides

For detailed setup instructions for each provider type:

* [Firebase Setup](/docs/configuration/external-auth/firebase)
* [Supabase Setup](/docs/configuration/external-auth/supabase)
* [Better-Auth Setup](/docs/configuration/external-auth/better-auth)
* [PlayFab Setup](/docs/configuration/external-auth/playfab)
* [AccelByte Setup](/docs/configuration/external-auth/accelbyte)
* [LootLocker Setup](/docs/configuration/external-auth/lootlocker)
* [Custom OIDC Setup](/docs/configuration/custom-auth/oidc-token) (for Auth0, Cognito, and others)
* [Custom Auth Server Setup](/docs/configuration/custom-auth/auth-token)
