Skip to main content
In this guide, you’ll learn how to:
  • Enable social sign-in providers in Supabase.
  • Configure provider settings correctly.
  • Connect them to your Rocket app for live authentication.
Heads up:
Social sign-in only works on your app’s live preview or custom domain.
It will not work inside Rocket.

Before you begin

You’ll need:
  • A Supabase account with an active project.
  • Your Supabase account connected to Rocket.
  • Your Rocket app’s live preview link or custom domain.
  • Access to the developer console for your chosen provider (e.g., Google, GitHub, or Facebook).

Set up a social provider in Supabase

The steps below use Google as an example.
The process is similar for other providers. For provider-specific instructions, refer to their documentation.
1

Open the provider settings in Supabase

  1. In your Supabase project, go to Authentication from the left menu.
  2. Click Sign In / Providers.
  3. Select your provider. In this case, choose Google.
List of authentication providers inside Supabase settings.List of authentication providers inside Supabase settings.

Open provider settings in Supabase

Success check: The provider settings panel opens, showing fields for credentials and a callback URL.
2

Create credentials in the provider console

In your provider’s developer console (e.g., Google Cloud Console):
  • Create a new OAuth 2.0 Client ID and Secret.
  • Under Authorized JavaScript origins, enter your Rocket app’s live preview URL or custom domain. Do not use localhost.
  • Under Authorized redirect URIs, paste the Callback URL from Supabase.
For Google, refer to the Google OAuth setup guide.
Success check: You now have a Client ID and Client Secret from your provider.
3

Enter credentials into Supabase

Back in Supabase, on the selected provider’s settings page:
  1. Paste the Client ID into the first field.
  2. Paste the Client Secret into the second field.
  3. Copy the Redirect URL shown in the third field.
    Make sure this exact URL is also set in your provider’s console.
Supabase Google provider settings including fields for Client ID, Client Secret, and Redirect URL.Supabase Google provider settings including fields for Client ID, Client Secret, and Redirect URL.

Enter credentials in Supabase

Always copy the callback URL directly from Supabase.
Each provider requires a unique format, and typos will break the flow.
Success check: The provider appears as enabled in your Supabase list.
4

Test sign-in in your Rocket app

  1. Publish your Rocket app to get the live preview URL.
  2. Open the live preview or your custom domain (not localhost).
  3. Click Sign in with [Provider].
  4. Complete the provider’s login flow.
Success check: You are redirected back to your Rocket app and signed in successfully.

Troubleshooting

1. OAuth error after clicking sign-in

What you’ll see:
Clicking the provider button opens an OAuth error page.
How to fix it:
  • Check that the Authorized redirect URI in the provider’s console matches the Supabase callback exactly.
  • Ensure the Authorized JavaScript origins includes your Rocket live preview or custom domain.

2. Redirected but not logged in

What you’ll see:
After login, you’re redirected but remain unauthenticated.
How to fix it:
  • Confirm Rocket is linked to the Supabase project where the provider is enabled.
  • Test only using your live preview link or custom domain, not localhost.

Social sign-in done right

You’ve successfully added social authentication to your Rocket app using Supabase.
Need help?
Email us at support@rocket.new or join our Discord community.