AppleAuthentication

Platform Compatibility

Installation

If you're installing this in a bare React Native app, you should also follow these additional installation instructions.

Configuration

EAS Build

Managed Workflow

1. Build with eas build -p ios. EAS Build and the config plugin will automatically configure this service with Apple.

Bare Workflow

1. Ensure you've added enabled the Apple Sign In capability, either through the Xcode:

• Signing & Capabilities > + Capability > Sign in with Apple
• Or by adding the entitlement to your ios/[app]/[app].entitlements file

  <key>com.apple.developer.applesignin</key>
  <array>
    <string>Default</string>
  </array>
  

1. Add "CFBundleAllowMixedLocalizations": true to your ios/[app]/Info.plist to ensure the sign in button uses the device locale.
2. Build with eas build -p ios. EAS Build will automatically configure this service with Apple.

Classic Build

1. For managed projects, set ios.usesAppleSignIn to true in app.json. For bare, enable the "Sign In with Apple" capability in your app. For bare projects, enable the capability in Xcode under "Signing & Capabilities" -- you'll need to be on Xcode 11 or later.
2. Log into the Apple Developer Console, go to "Certificates, Identifiers, & Profiles" and then "Identifiers".
3. You need to choose a primary app for the Apple Sign In configuration. This is the app whose icon will show up in the Apple Sign In system UI. If you have a set of related apps you might choose the "main" app as the primary, but most likely you'll want to just use the app you're working on now as the primary.
4. In the list of identifiers, click on the one corresponding to your primary app. Enable the "Sign In with Apple" capability, click "Edit", and choose the "Enable as a primary App ID" option. Save the new configuration.
5. If you chose a different app to be the primary, you'll also need to open up the configuration page for your current app, enable the "Sign In with Apple" capability, click "Edit" and choose the "Group with an existing primary App ID" option. Save this configuration as well.
6. Next, go to the "Keys" page and register a new key. Add the "Sign In with Apple" capability, and make sure to choose the correct primary app on the configuration screen.
7. Finally, when you want to make a standalone build to test with, run expo build:ios --clear-provisioning-profile --revoke-credentials so that your provisioning profile is regenerated with the new entitlement.
8. (Optional) If you'd like to localize the button text, you can add "CFBundleAllowMixedLocalizations": true to your ios.infoPlist property in your app.json. Note: The localized value will only appear in your standalone app.

Usage

import * as AppleAuthentication from 'expo-apple-authentication';

function YourComponent() {
  return (
    <AppleAuthentication.AppleAuthenticationButton
      buttonType={AppleAuthentication.AppleAuthenticationButtonType.SIGN_IN}
      buttonStyle={AppleAuthentication.AppleAuthenticationButtonStyle.BLACK}
      cornerRadius={5}
      style={{ width: 200, height: 44 }}
      onPress={async () => {
        try {
          const credential = await AppleAuthentication.signInAsync({
            requestedScopes: [
              AppleAuthentication.AppleAuthenticationScope.FULL_NAME,
              AppleAuthentication.AppleAuthenticationScope.EMAIL,
            ],
          });
          // signed in
        } catch (e) {
          if (e.code === 'ERR_CANCELED') {
            // handle that the user canceled the sign-in flow
          } else {
            // handle other errors
          }
        }
      }}
    />
  );
}

Development and Testing

Verifying the Response from Apple

API

import * as AppleAuthentication from 'expo-apple-authentication';

Component

Methods

Event Subscriptions

Types

Enums

Error Codes