Auth

Login with Apple


Supabase Auth supports using Sign in with Apple on the web and in native apps for iOS, macOS, watchOS or tvOS.

Overview

To support Sign in with Apple, you need to configure the Apple provider in the Supabase dashboard for your project.

There are three general ways to use Sign in with Apple, depending on the application you're trying to build:

In some cases you're able to use the OAuth flow within web-based native apps such as with React Native, Expo or other similar frameworks. It is best practice to use native Sign in with Apple capabilities on those platforms instead.

When developing with Expo, you can test Sign in with Apple via the Expo Go app, in all other cases you will need to obtain an Apple Developer account to enable the capability.

Apple sign in on iOS and macOS

You can perform Apple sign in using the sign_in_with_apple package on Flutter apps running on iOS or macOS. Follow the instructions in the package README to set up native Apple sign in on iOS and macOS.

Once the setup is complete on the Flutter app, add the bundle ID of your app to your Supabase dashboard in Authentication -> Providers -> Apple in order to register your app with Supabase.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
import 'package:sign_in_with_apple/sign_in_with_apple.dart';import 'package:supabase_flutter/supabase_flutter.dart';import 'package:crypto/crypto.dart';/// Performs Apple sign in on iOS or macOSFuture<AuthResponse> signInWithApple() async { final rawNonce = supabase.auth.generateRawNonce(); final hashedNonce = sha256.convert(utf8.encode(rawNonce)).toString(); final credential = await SignInWithApple.getAppleIDCredential( scopes: [ AppleIDAuthorizationScopes.email, AppleIDAuthorizationScopes.fullName, ], nonce: hashedNonce, ); final idToken = credential.identityToken; if (idToken == null) { throw const AuthException( 'Could not find ID Token from generated credential.'); } return supabase.auth.signInWithIdToken( provider: OAuthProvider.apple, idToken: idToken, nonce: rawNonce, );}

Configuration

  1. Have an App ID which uniquely identifies the app you are building. You can create a new App ID from the Identifiers section in the Apple Developer Console (use the filter menu in the upper right side to see all App IDs). These usually are a reverse domain name string, for example com.example.app. Make sure you configure Sign in with Apple for the App ID you created or already have, in the Capabilities list. At this time Supabase Auth does not support Server-to-Server notification endpoints, so you should leave that setting blank. (In the past App IDs were referred to as bundle IDs.)
  2. Register all of the App IDs that will be using your Supabase project in the Apple provider configuration in the Supabase dashboard under Client IDs.

Apple sign in on Android, Web, Windows and Linux

For platforms that doesn't support native Apple sign in, you can use the signInWithOAuth() method to perform the Apple sign in.

This method of signing in is web based, and will open a browser window to perform the sign in. For non-web platforms, the user is brought back to the app via deep linking.

1
2
3
4
5
6
await supabase.auth.signInWithOAuth( OAuthProvider.apple, redirectTo: kIsWeb ? null : 'my.scheme://my-host', // Optionally set the redirect link to bring back the user via deeplink. authScreenLaunchMode: kIsWeb ? LaunchMode.platformDefault : LaunchMode.externalApplication, // Launch the auth screen in a new webview on mobile.);

This call takes the user to Apple's consent screen. Once the flow ends, the user's profile information is exchanged and validated with Supabase Auth before it redirects back to your Flutter application with an access and refresh token representing the user's session.

Configuration

You will require the following information:

  1. Your Apple Developer account's Team ID, which is an alphanumeric string of 10 characters that uniquely identifies the developer of the app. It's often accessible in the upper right-side menu on the Apple Developer Console.
  2. Register email sources for Sign in with Apple for Email Communication which can be found in the Services section of the Apple Developer Console.
  3. An App ID which uniquely identifies the app you are building. You can create a new App ID from the Identifiers section in the Apple Developer Console (use the filter menu in the upper right side to see all App IDs). These usually are a reverse domain name string, for example com.example.app. Make sure you configure Sign in with Apple once you create an App ID in the Capabilities list. At this time Supabase Auth does not support Server-to-Server notification endpoints, so you should leave that setting blank. (In the past App IDs were referred to as bundle IDs.)
  4. A Services ID which uniquely identifies the web services provided by the app you registered in the previous step. You can create a new Services ID from the Identifiers section in the Apple Developer Console (use the filter menu in the upper right side to see all Services IDs). These usually are a reverse domain name string, for example com.example.app.web.
  5. Configure Website URLs for the newly created Services ID. The web domain you should use is the domain your Supabase project is hosted on. This is usually <project-id>.supabase.co while the redirect URL is https://<project-id>.supabase.co/auth/v1/callback.
  6. Create a signing Key in the Keys section of the Apple Developer Console. You can use this key to generate a secret key using the tool below, which is added to your Supabase project's Auth configuration. Make sure you safely store the AuthKey_XXXXXXXXXX.p8 file. If you ever lose access to it, or make it public accidentally, revoke it from the Apple Developer Console and create a new one immediately. You will have to generate a new secret key using this file every 6 months, so make sure you schedule a recurring reminder in your calendar!
  7. Finally, add the information you configured above to the Apple provider configuration in the Supabase dashboard.