> ## Documentation Index
> Fetch the complete documentation index at: https://docs.shipmobilefast.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Apple OAuth

> Implement OAuth authentication

# Sign in with Apple on Expo React Native

## Overview

Apple OAuth consists of six broad steps:

1. Obtaining an App Id with “Sign In with Apple” capabilities.
2. Obtaining a Services Id - this will serve as the client\_id.
3. Obtaining a secret key that will be used to get our client\_secret.
4. Generating the client\_secret using the secret key.
5. Add your client id and client secret keys to your Supabase Project.
6. Add the login code to your Supabase JS Client App.

<Steps>
  <Step>
    Go to [developer.apple.com](https://developer.apple.com).
    Click on `Account` at the top right to log in.
  </Step>

  <Step>
    ### Obtain an App ID

    * Go to Certificates, Identifiers & Profiles.
    * Click on Identifiers at the left.
    * Click on the `+` sign in the upper left next to Identifiers.
    * Select `App IDs` and click `Continue`.
    * Select type `App` and click `Continue`.
    * Fill out your app information:
    * App description.
    * Bundle ID (Apple recommends reverse-domain name style, so if your domain is acme.com and your app is called roadrunner, use: "com.acme.roadrunner").
    * Scroll down and check `Sign In With Apple`.
    * Click `Continue` at the top right.
    * Click `Register` at the top right.
  </Step>

  <Step>
    ### Obtain a Services ID

    This will serve as the client\_id when you make API calls to authenticate the user.

    * Go to Certificates, Identifiers & Profiles.
    * Click on Identifiers at the left.
    * Click on the `+` sign in the upper left next to Identifiers.
    * Select `Services IDs` and click `Continue`.
    * Fill out your information:
      * App description.
    * Bundle ID (you can't use the same Bundle ID from the previous step, but you can just add something to the beginning, such as "app." to make it app.com.acme.roadrunner").
    * SAVE THIS ID -- this ID will become your client\_id later.
    * Click `Continue` at the top right.
    * Click `Register` at the top right.
  </Step>

  <Step>
    ### Find your callback URL

    The next step requires a callback URL, which looks like this:

    * `https://<project-ref>.supabase.co/auth/v1/callback`
    * Go to your Supabase Project Dashboard
    * Click on the Authentication icon in the left sidebar
    * Click on Providers under the Configuration section
    * Click on Apple from the accordion list to expand and you'll find your Redirect URL, you can click Copy to copy it to the clipboard
  </Step>

  <Step>
    ### Configure your Services ID

    * Under Identifiers, click on your newly-created Services ID.
    * Check the box next to Sign In With Apple to enable it.
    * Click `Configure` to the right.
    * Make sure your newly created Bundle ID is selected under Primary App ID
    * Add your domain to the Domains and Subdomains box (do not add https\://, just add the domain).
    * In the Return URLs box, type the callback URL of your app which you found in the previous step and click Next at the bottom right.
    * Click `Done` at the bottom.
    * Click `Continue` at the top right.
    * Click `Save` at the top right.
  </Step>

  <Step>
    ### Download your secret key

    Now you'll need to download a secret key file from Apple that will be used to generate your client\_secret.

    * Go to Certificates, Identifiers & Profiles.
    * Click on Keys at the left.
    * Click on the `+` sign in the upper left next to Keys.
    * Enter a Key Name.
    * Check Sign In with Apple.
    * Click `Configure` to the right.
    * Select your newly-created Services ID from the dropdown selector.
    * Click `Save` at the top right.
    * Click `Continue` at the top right.
    * Click `Register` at the top right.
    * Click `Download` at the top right.
    * Save the downloaded file -- this contains your "secret key" that will be used to generate your client\_secret.
    * Click `Done` at the top right.
  </Step>

  <Step>
    ### Generate a client\_secret

    The secret key you downloaded is used to create the client\_secret string you'll need to authenticate your users.

    * According to the [Apple Docs](https://developer.apple.com/documentation/signinwithapplerestapi/generate_and_validate_tokens) it needs to be a JWT token encrypted using the Elliptic Curve Digital Signature Algorithm (ECDSA) with the P-256 curve and the SHA-256 hash algorithm.
    * At this time, the easiest way to generate this JWT token is with Ruby. If you don't have Ruby installed, you can Download Ruby [Here](https://www.ruby-lang.org/en/downloads/).
  </Step>

  <Step>
    * Install Ruby (or check to make sure it's installed on your system).
    * Install ruby-jwt.
    * From the command line, run: sudo gem install jwt.
    * Create the script below using a text editor: secret\_gen.rb
  </Step>

  <Step>
    ```ruby theme={null}
            require "jwt"

            key_file = "Path to the private key"
            team_id = "Your Team ID"
            client_id = "The Service ID of the service you created"
            key_id = "The Key ID of the private key"

            validity_period = 180 # In days. Max 180 (6 months) according to Apple docs.

            private_key = OpenSSL::PKey::EC.new IO.read key_file

            token = JWT.encode(
            {
                iss: team_id,
                iat: Time.now.to_i,
                exp: Time.now.to_i + 86400 * validity_period,
                aud: "https://appleid.apple.com",
                sub: client_id
            },
            private_key,
            "ES256",
            header_fields=
            {
                kid: key_id
                }
            )
            puts token
    ```
  </Step>

  <Step>
    1. Edit the secret\_gen.rb file:

    * key\_file = "Path to the private key you downloaded from Apple". It should look like this: AuthKey\_XXXXXXXXXX.p8.
    * team\_id = "Your Team ID". This is found at the top right of the Apple Developer site (next to your name).
    * client\_id = "The Service ID of the service you created". This is the Services ID you created in the above step Obtain a Services ID. If you've lost this ID, you can find it in the Apple Developer Site:
      * Go to Certificates, Identifiers & Profiles.
      * Click Identifiers at the left.
      * At the top right drop-down, select Services IDs.
      * Find your Identifier in the list (i.e. app.com.acme.roadrunner).
    * key\_id = "The Key ID of the private key". This can be found in the name of your downloaded secret file (For a file named AuthKey\_XXXXXXXXXX.p8 your key\_id is XXXXXXXXXX). If you've lost this ID, you can find it in the Apple Developer Site:
      * Go to Certificates, Identifiers & Profiles.
      * Click Keys at the left.
      * Click on your newly-created key in the list.
      * Look under Key ID to find your key\_id.

    1. From the command line, run: ruby secret\_gen.rb > client\_secret.txt.
    2. Your client\_secret is now stored in this client\_secret.txt file.
  </Step>

  <Step>
    ### Add your OAuth credentials to Supabase

    * Go to your Supabase Project Dashboard
    * In the left sidebar, click the Authentication icon (near the top)
    * Click on Providers under the Configuration section
    * Click on Apple from the accordion list to expand and turn Apple Enabled to ON
    * Enter your Apple Client ID and Apple Client Secret saved in the previous step
    * Click Save
  </Step>
</Steps>