Apple
Set up Sign in with Apple for your Floot application.
Sign in with Apple requires a paid membership to the Apple Developer Program. Sign in with Apple is one of the restricted services which is not available for free with just an Apple ID (source).
Apple Developer Console Setup
Create App ID
Go to identifiers section of the console → filter by App IDs
(upper right menu) → click the +
button (upper left, next to "Identifiers") → App IDs
→ App
- Description > give a meaningful description
- Bundle ID > can be found:
- Open the
ios
(ormacos
if you are setting up that platform) folder of your Flutter project in Xcode (right click on the folder →Open in Xcode
) Runner
(sidebar) →General
(tab bar) >Runner
(TARGETS
sidebar) →Identity
→Bundle Identifier
- Open the
- Capabilities (tab bar) > select
Sign in with Apple
→ Continue
→ Register
When using Supabase Cloud, 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.
Service ID & Keys (Android, Web, Windows)
Create Service ID
Go to identifiers section of the console → filter by Services IDs
(upper right menu) → click the +
button (upper left, next to "Identifiers") → Services IDs
- Description > give a meaningful description
- Identifier > use a unique reverse-domain (e.g.
com.domainname.appname.web
)
→ Continue
→ Register
Configure Service ID
Open the newly created service ID → enable Sign in with Apple
→ Configure
- Primary App ID > choose the App ID you previously created in the step before
- Domains and Subdomains > options:
Apple does not accept http
protocol, but there is a solution using Local Port Forwarding with VS Code-based editors.
Know that the forward URL generated by this method is temporary. Meaning you'll have to repeat this process every-time you quit the editor (mainly the visibility which tends to go back in private state). To have have a static URL, you can use Zrok (open source) or Ngrok.
- From your code editor, open the terminal.
PORTS
(tab bar) →Forward a Port
→54321
- Right click on created port →
Port Visibility
→Public
- Use the generated endpoint (without the https protocol) to redirect Apple events to your Supabase local instance.
Example generated endpoint with https:
https://3k5jk495-54321.abc1.devtunnels.ms/
<generated.forward.address.without.https>
Generated endpoint without the https:
3k5jk495-54321.abc1.devtunnels.ms
<project-id>.supabase.co
<your.domain.without.https>
- Return URLs > options:
Use the FULL HTTPS endpoint generated above.
<generated.forward.address>/auth/v1/callback
e.g.
https://3k5jk495-54321.abc1.devtunnels.ms/auth/v1/callback
https://<project-id>.supabase.co/auth/v1/callback
https://<your.domain>:54321/auth/v1/callback
Create & Download Key
Go to keys section of the console → click the +
button (upper left, next to "Keys")
- Key Name > give meaningful name
- Key Usage Description (optional) > give a meaningful description
- Select
Sign in with Apple
from the list →Configure
- Primary App ID > choose the App ID you previously created in the step before →
Save
- Primary App ID > choose the App ID you previously created in the step before →
→ Continue
→ Register
→ Download
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 also have to generate a new secret key using this file every 6 months, so make sure you schedule a recurring reminder in your calendar!
Generate Secret Key
Keep in mind that you will have to renew your secret key every 6 month! So make sure to keep track of it.
Go to Supabase's Apple Docs page → scroll until you find a tool (Ctrl/Cmd + F
to search "tool
" keyword can also help)
- Account ID > it corresponds to your team id in your developer account
- Service ID > refers to the Service ID created above
- Choose File > refers to the downloaded key from the previous step
→ Generate Secret Key
When using Supabase Cloud, add the information you configured above to the Apple provider configuration in the Supabase dashboard.
Floot App Setup
Xcode Configuration
At this point you should have added the Sign in with Apple capability to your own app.
In case you don't have
Automatically manage Signing
turned on in Xcode, you will need to recreate and download the updated Provisioning Profiles for your app, so they include the newSign in with Apple
capability. Then you can download the new certificates and select them in Xcode.In case XCode manages your signing, this step will be done automatically for you. Just make sure the
Sign in with Apple
capability is active as described below.Additionally this assumes that you have at least one iOS device registered in your developer account for local testing, so you can run the example on a device.
Enable Apple Sign in capability for iOS:
- Open your
ios
ormacos
folder in Xcode (right click on the folder →Open in Xcode
) - Go to
Runner
(under "TARGETS
") ->Signing & Capabilities
- Click on the
+ Capability
button to add a capability - Add
Sign in with Apple
- Now open a terminal in your project folder and execute the follow commands
cd ios
ormacos
bundle install
, to install the Ruby dependencies used for Cocoapodsbundle exec pod install
, to install the Cocoapods for the iOS project
Environment Variables
Supabase supabase/.env*
file:
# Apple Developer Console -> Identifiers -> App IDs -> Bundle ID.
# You can provide many IDs separated by commas like this: "com.example.ios,com.example.macos"
OAUTH_APPLE_CLIENT_ID=
Environment Variables
Supabase supabase/.env*
file:
- Client ID
# Apple Developer Console -> Identifiers -> Services IDs -> Identifier.
# You can provide many IDs separated by commas like this: "com.example.web,com.example.mobile"
# For some reason, only the first ID of the list is used in the OAuth process, so make sure to make that one the Service ID.
OAUTH_APPLE_CLIENT_ID=
- Redirect URL
# Supabase Auth Service callback url to complete Apple OAuth sign-in.
OAUTH_APPLE_REDIRECT_URI=
OAUTH_APPLE_REDIRECT_URI corresponds to the value you provided as Return URL above! See Configure Service ID.
- Secret Key
# Apple secret key for OAuth.
OAUTH_APPLE_SECRET=
OAUTH_APPLE_SECRET corresponds to the secret key you generated above! See Generate Secret Key.
- Redirect URI
# Supabase Auth Service callback url to complete OAuth sign-in.
SUPA_AUTH_EXTERNAL_REDIRECT_URI=
Possible values
http://127.0.0.1:54321/auth/v1/callback
https://<project-id>.supabase.co/auth/v1/callback
https://<your.domain>:54321/auth/v1/callback
OAuth deep link redirection (optional)
Before You Proceed
Only mandatory if you did not provide a custom organization at Floot app creation! More info here!
Apple Sign in with Supabase on Web, macOS, Windows, and Linux is done through the OAuth method.
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, which is already setup by default in every Floot app.
→ Setup OAuth redirection by following this guide!
Environment Variables
Supabase supabase/.env*
file:
- Client ID
# Apple Developer Console -> Identifiers -> Services IDs -> Identifier.
# You can provide many IDs separated by commas like this: "com.example.web,com.example.mobile"
# For some reason, only the first ID of the list is used in the OAuth process, so make sure to make that one the Service ID.
OAUTH_APPLE_CLIENT_ID=
- Redirect URL
# Supabase Auth Service callback url to complete Apple OAuth sign-in.
OAUTH_APPLE_REDIRECT_URI=
OAUTH_APPLE_REDIRECT_URI corresponds to the value you provided as Return URL above! See Configure Service ID.
- Secret Key
# Apple secret key for OAuth.
OAUTH_APPLE_SECRET=
OAUTH_APPLE_SECRET corresponds to the secret key you generated above! See Generate Secret Key.
- Redirect URI
# Supabase Auth Service callback url to complete OAuth sign-in.
SUPA_AUTH_EXTERNAL_REDIRECT_URI=
Possible values
http://127.0.0.1:54321/auth/v1/callback
https://<project-id>.supabase.co/auth/v1/callback
https://<your.domain>:54321/auth/v1/callback
OAuth deep link redirection (optional)
Before You Proceed
Only mandatory if you did not provide a custom organization at Floot app creation! More info here!
Apple Sign in with Supabase on Web, macOS, Windows, and Linux is done through the OAuth method.
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, which is already setup by default in every Floot app.
→ Setup OAuth redirection by following this guide!
Xcode Configuration
At this point you should have added the Sign in with Apple capability to your own app.
In case you don't have
Automatically manage Signing
turned on in Xcode, you will need to recreate and download the updated Provisioning Profiles for your app, so they include the newSign in with Apple
capability. Then you can download the new certificates and select them in Xcode.In case XCode manages your signing, this step will be done automatically for you. Just make sure the
Sign in with Apple
capability is active as described below.Additionally this assumes that you have at least one iOS device registered in your developer account for local testing, so you can run the example on a device.
Enable Apple Sign in capability for iOS:
- Open your
ios
ormacos
folder in Xcode (right click on the folder →Open in Xcode
) - Go to
Runner
(under "TARGETS
") ->Signing & Capabilities
- Click on the
+ Capability
button to add a capability - Add
Sign in with Apple
- Now open a terminal in your project folder and execute the follow commands
cd ios
ormacos
bundle install
, to install the Ruby dependencies used for Cocoapodsbundle exec pod install
, to install the Cocoapods for the iOS project
Environment Variables
Supabase supabase/.env*
file:
# Apple Developer Console -> Identifiers -> App IDs -> Bundle ID.
# You can provide many IDs separated by commas like this: "com.example.ios,com.example.macos"
OAUTH_APPLE_CLIENT_ID=
Environment Variables
Supabase supabase/.env*
file:
- Client ID
# Apple Developer Console -> Identifiers -> Services IDs -> Identifier.
# You can provide many IDs separated by commas like this: "com.example.web,com.example.mobile"
# For some reason, only the first ID of the list is used in the OAuth process, so make sure to make that one the Service ID.
OAUTH_APPLE_CLIENT_ID=
- Redirect URL
# Supabase Auth Service callback url to complete Apple OAuth sign-in.
OAUTH_APPLE_REDIRECT_URI=
OAUTH_APPLE_REDIRECT_URI corresponds to the value you provided as Return URL above! See Configure Service ID.
- Secret Key
# Apple secret key for OAuth.
OAUTH_APPLE_SECRET=
OAUTH_APPLE_SECRET corresponds to the secret key you generated above! See Generate Secret Key.
- Redirect URI
# Supabase Auth Service callback url to complete OAuth sign-in.
SUPA_AUTH_EXTERNAL_REDIRECT_URI=
Possible values
http://127.0.0.1:54321/auth/v1/callback
https://<project-id>.supabase.co/auth/v1/callback
https://<your.domain>:54321/auth/v1/callback
OAuth deep link redirection (optional)
Before You Proceed
Only mandatory if you did not provide a custom organization at Floot app creation! More info here!
Apple Sign in with Supabase on Web, macOS, Windows, and Linux is done through the OAuth method.
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, which is already setup by default in every Floot app.
→ Setup OAuth redirection by following this guide!