Sign In with Apple

Instant supports Sign In with Apple on the Web and in native applications.

Web Popup (recommended)

Use Apple-provided popup to authenticate users

Web Redirect

Use redirect flow to authenticate users

React Native

Authenticating in React Native app

#Step 1: Create App ID

Navigate to Certificates, Identifiers & Profiles
Select Identifiers
Click +
Register a new identifier → Select App IDs
Select a type → Select App
Capabilities → Sign In with Apple → Check
Fill in Bundle ID and Description
Click Register

#Step 2: Create Services ID

Navigate to Services IDs
Click +
Register a new identifier → Select Services IDs
Fill in Description and Identifier. You’ll need this Identifier later
Click Register

Select newly created Services ID
Enable Sign In with Apple
Click Configure
Select Primary App ID from Step 1
To Domains, add your app domain (e.g. myapp.com)
To Return URLs, add URL of your app where authentication happens (e.g. https://myapp.com/signin)
Click Continue → Save

#Step 4: Register your OAuth client with Instant

From the dashboard

From the Auth tab on the Instant dashboard:

Click "Add Apple Client"
Select a unique client name (apple by default, used in db.auth calls)
Fill in your "Services ID" from Step 2
Click "Add Apple Client"

From the terminal

npx instant-cli@latest auth client add \
  --type apple --name apple --services-id <services-id>

Add Apple Sign In library to your app:

https://appleid.cdn-apple.com/appleauth/static/jsapi/appleid/1/en_US/appleid.auth.js

Initialize with Services ID from Step 2:

AppleID.auth.init({
  clientId: '<Services ID>',
  scope: 'name email',
  redirectURI: window.location.href,
});

Implement signInPopup using clientName from Step 4:

async function signInPopup() {
  let nonce = crypto.randomUUID();
 
  // authenticate with Apple
  let resp = await AppleID.auth.signIn({
    nonce: nonce,
    usePopup: true,
  });
 
  // authenticate with Instant
  await db.auth.signInWithIdToken({
    clientName: '<clientName>',
    idToken: resp.authorization.id_token,
    nonce: nonce,
  });
}

Add Sign In button:

<button onClick={signInPopup}>Sign In with Apple</button>

instant