Skip to main content

​
Overview

This guide walks you through creating Google OAuth credentials and connecting them to the Launch mobile app. The boilerplate uses Expo AuthSession in apps/mobile/lib/auth/google.ts and sends the Google token to the API for verification. These steps work for both iOS and Android in the Launch template.

​
Prerequisites

  • Access to Google Cloud Console
  • A Google Cloud project created for your app
Start with Backend Authentication Setup so your API and env file are in place.

​
Steps

​
Step 1: Create your OAuth client ID (iOS)

Open Google Cloud Console, then go to APIs & Services → Credentials and click Create credentials → OAuth client ID. If Google prompts you to configure the OAuth consent screen first, complete that setup before continuing. Choose External, enter your app name, support email, and developer contact email, then add yourself as a test user. Save the changes and return to the Credentials page. Now create an iOS OAuth client. Give it a name, then enter the iOS bundle identifier from apps/mobile/app.config.ts. After you create the client, copy the iOS client ID—you will use it in your mobile environment file.

​
Step 2: Create a Web client ID (required)

The shared Google Auth module validates both an iOS client ID and a Web client ID, even when you are testing mobile locally. Create a Web application OAuth client and use your ngrok HTTPS URL for both the origin and redirect. Set these values in the Web client configuration (replace with your ngrok forwarding URL):
  • Authorized JavaScript origins: https://YOUR_NGROK_ID.ngrok-free.app
  • Authorized redirect URIs: https://YOUR_NGROK_ID.ngrok-free.app/api/auth/callback/google
These should match the ngrok URL you set in your backend and mobile env files so the OAuth flow stays on a single origin.

​
Step 3: Update environment files

Update apps/mobile/.env with:
  • EXPO_PUBLIC_GOOGLE_IOS_CLIENT_ID
  • EXPO_PUBLIC_GOOGLE_WEB_CLIENT_ID
Update apps/api/.env with:
  • GOOGLE_WEB_CLIENT_ID
  • GOOGLE_CLIENT_SECRET
Restart the API after changing backend values. For the mobile app, stop your dev server and run pnpm ios or pnpm android again so the updated env values are bundled into the development build. You only need to run pnpm prebuild again if you changed native config in apps/mobile/app.config.ts (for example, URL schemes). Update apps/mobile/app.config.ts to enable the iOS URL scheme used by Google Sign-In. Set the CFBundleURLName to a readable app name, and set the CFBundleURLSchemes value to the iOS URL scheme shown in Google Cloud Console for the iOS client you created in Step 1. If these values are currently commented out, uncomment them and replace the placeholders. When you set CFBundleURLName, it is safest to use the same value as your bundle identifier (for example, com.company.launchstarter) so it stays consistent with the rest of your iOS configuration.

​
Step 5: Test the sign-in flow

Open the app, tap Google Sign-In, and complete the consent flow. You should be redirected back into the app and see an authenticated session.