Google OAuth

Google Console Setup for Web Client ID

This guide will walk you through the steps to set up a project in Google Console, create an OAuth consent screen, and generate a web client ID for Google authentication in your Expo app.

Creating a Project in Google Console

  1. Go to Google Cloud Console and sign in with your Google account.
  2. Click on the project selector dropdown at the top of the page.
  3. Click on "New Project".
  4. Enter a name for your project and click "Create".
  5. Once the project is created, select it from the project selector dropdown. Google Console New Project
  1. In Google Cloud Console, navigate to the "APIs & Services" > "OAuth consent screen" page from the left sidebar.
  2. Click on "Create" to start setting up your consent screen.
  3. Choose the user type for your application (Internal or External) and click "Create".
  4. Fill out the required fields on the consent screen configuration form:
    • Application name: Enter the name of your application.
    • User support email: Enter an email address where users can contact you for support.
    • Developer contact information: Provide contact information for the developer of the application.
  5. Click "Save and Continue".

Getting Your Expo Configuration

Your Expo username and app slug are required for setting up the redirect URL. These can be found in your app.json:

Info:Finding Your App Details
Show

In your app.json, look for:

{
  "expo": {
    "owner": "your-username",
    "slug": "your-app-slug"
  }
}

If owner is not set, it will use your Expo username.

Creating a Web Client ID

  1. Navigate to the "Credentials" page under "APIs & Services" in Google Cloud Console.

  2. Click on "Create credentials" and select "OAuth client ID".

  3. Choose "Web application" as the application type.

  4. Add the following configurations:

    • Authorized JavaScript origins:
      https://auth.expo.io
    • Authorized redirect URIs:
      https://auth.expo.io/@your-username/your-app-slug
      Replace your-username and your-app-slug with your actual Expo username and app slug.
  5. Click "Create" to generate your web client ID.

  6. Copy the client ID - you'll need this for your app's Google Sign-In configuration.

Warning:Important
Show

Make sure to:

  • Use your correct Expo username and app slug in the redirect URI
  • Include both the JavaScript origin and redirect URI exactly as shown
  • Keep the @ symbol in the redirect URI

Conclusion

You have successfully set up a project in Google Console and generated the web client ID for Google authentication. You can now use this client ID in your Expo application's Google Sign-In configuration.

Tip:Next Steps
Show

Return to the quickstart guide and use your web client ID in the Google Sign-In configuration:

const [request, response, promptAsync] = Google.useAuthRequest({
    webClientId: 'YOUR_WEB_CLIENT_ID', // Add it here
    // ... other configuration
});

On this page