How to Add Google and Apple Login to Your App

Your app can let people sign in with their Google or Apple account instead of typing an email and a password. Snapp adds the button and the code. The sign-in provider itself has to be turned on by you, because it needs keys from your own Google Cloud or Apple Developer account. This guide walks through every step. It takes about 15 minutes.

What you get

• A "Continue with Google" or "Continue with Apple" button on your sign-in screen.
• Accounts stored in your own Supabase project, next to the email and password accounts.
• The same button works in the Snapp preview, in the shared web link and in the published app.

Email and password sign-in stays available. Social sign-in is an addition, not a replacement.

Before you start

• Your app must be connected to Supabase. In Snapp open Settings, then Environment, then Connect Supabase.
• Ask Snapp to add the button, for example: "Add Google and Apple sign-in to the login screen." Snapp wires the button to its built-in social sign-in helper.
• Until the provider is turned on, tapping the button shows a short message that says sign-in is not set up yet and links to this guide. Nothing breaks. Email sign-in keeps working.

Step 1: Find your Supabase callback address

1. Open your project at supabase.com and go to Authentication, then Sign In / Providers. 2. Click Google. The panel shows a "Callback URL (for OAuth)". It looks like this:

https://abcdefghijklmnop.supabase.co/auth/v1/callback

Copy it. Google and Apple both need this exact address.

Step 2: Google

1. Go to console.cloud.google.com and create a project (or pick an existing one). 2. Open APIs & Services, then OAuth consent screen. Choose External, fill in the app name, support email and developer email, and save. 3. Still on the consent screen, publish the app. If you leave it in Testing mode only the test users you list can sign in, and everyone sees an "unverified app" warning. 4. Open APIs & Services, then Credentials, then Create credentials, then OAuth client ID. 5. Application type: Web application. Under Authorized redirect URIs add the callback address from Step 1. Save. 6. Copy the Client ID and the Client secret. 7. Back in Supabase, Authentication, Sign In / Providers, Google: switch it on, paste the Client ID and Client secret, save.

That is all Google needs. The same Web client works for Android, iPhone and the web, because the sign-in happens in the browser and comes back through Supabase.

Step 3: Apple

Apple sign-in needs a paid Apple Developer account.

1. Go to developer.apple.com, then Certificates, Identifiers & Profiles, then Identifiers. 2. Create an App ID for your app if you do not have one, and tick the Sign in with Apple capability. 3. Create a new identifier of type Services ID. Give it a name and an identifier such as com.yourcompany.yourapp.signin. Enable Sign in with Apple on it, click Configure, pick your App ID as the primary App ID, and under Return URLs add the callback address from Step 1. Save. 4. Go to Keys, create a key, tick Sign in with Apple, pick your App ID, and download the .p8 file. Note the Key ID and your Team ID (shown at the top right of the developer portal). 5. Back in Supabase, Authentication, Sign In / Providers, Apple: switch it on. Enter the Services ID as the Client ID. Generate the secret key from your Team ID, Key ID and the .p8 file as described on the Supabase Apple provider page, paste it into Secret Key, save.

Apple requires this secret to be renewed every six months. Put a reminder in your calendar. When it expires, Apple sign-in stops working until you paste a new one.

If your app offers Google sign-in on the App Store, Apple also requires you to offer Sign in with Apple. Snapp adds both buttons together for that reason.

Step 4: Check the redirect URLs

After signing in, Supabase sends the person back to your app. It only does that for addresses on its allow list.

1. In Supabase open Authentication, then URL Configuration. 2. Under Redirect URLs make sure these are listed:

snapp://auth-callback
https://snappai.co/preview/

If you connected Supabase from inside Snapp, they are already there. If you pasted your Supabase keys into Snapp by hand, add them now.

3. When you publish your app to the stores, add one more line with your app's bundle identifier, for example:

com.yourcompany.yourapp://auth-callback

Snapp adds this one for you at publish time when it can. Check the list after your first publish.

Step 5: Test it

Open your app in Snapp and tap the Google or Apple button. A browser sheet opens, you sign in, and the app comes back signed in. Try it once on each platform you care about. The first sign-in creates the account in Supabase, under Authentication, then Users.

If something does not work

The button says "sign-in is not set up". The provider is still off in Supabase, or the keys are missing. Go back to Step 2 or Step 3 and make sure the switch is on and saved.

Google shows "redirect_uri_mismatch". The Authorized redirect URI in Google Cloud does not match the callback address from Step 1. It must be the full address, including /auth/v1/callback, with no trailing slash.

Google shows "This app is blocked" or "access_denied". The consent screen is still in Testing mode, or your account is not on its test user list. Publish the consent screen.

You sign in, but the app does not log in. The return address is not on the Redirect URLs list in Step 4. Add it exactly as shown.

Apple sign-in worked and then stopped. The Apple secret key expired. Generate a new one and paste it into Supabase.

Nothing responds at all. Your Supabase project may be paused. Free projects pause after a week without traffic. Open the project in the Supabase dashboard and restore it.

Email and password sign-in is affected too. That is a different problem. Check whether "Confirm email" is on in Supabase and whether the project is paused.

Frequently asked questions

Why can Snapp not do this for me? Google and Apple only hand out sign-in keys to the owner of the Google Cloud or Apple Developer account. Snapp has no way to create them on your behalf, and the keys must live in your Supabase project, not ours.

Do I pay anything? Google sign-in is free. Apple sign-in needs an Apple Developer account, which you already need to publish on the App Store.

Can I add Facebook, GitHub or Microsoft? Yes. Supabase supports many providers. Turn the provider on in Supabase with its keys, then ask Snapp to add the matching button.

Can I remove the button later? Yes. Ask Snapp to remove it. Existing accounts stay in Supabase.