Google OAuth "Bad request" error on local development with Supabase CLI

I'm getting a "Bad request" error when trying to authenticate with Google OAuth using local Supabase development. The OAuth flow starts correctly, but fails when redirecting back to the Supabase auth endpoint. On cloud works just fine!

What I'm trying to achieve:

Set up Google OAuth authentication in a Next.js app using local Supabase development
User should be able to sign in with Google and be redirected back to the app

What's going wrong:

Google OAuth consent screen does not appear
When redirecting to http://127.0.0.1:54321/auth/v1/authorize?provider=google&code_challenge=..., I get:

 json
{
  "message": "Bad request"
}

 json
{
  "message": "Bad request"
}

 json
{
  "message": "Bad request"
}

 json
{
  "message": "Bad request"
}

Environment details:

OS: Linux (Ubuntu)
Framework: Next.js 15+ with App Router
Platform: Web
Library: @supabase/ssr (latest), @supabase/supabase-js (latest)
Supabase CLI: local development (npx supabase)

Configuration tested:

Google Cloud Console redirect URI: http://127.0.0.1:54321/auth/v1/callback
Environment variables are correctly loaded in the auth container:
GOTRUE_EXTERNAL_GOOGLE_CLIENT_ID:

correct
GOTRUE_EXTERNAL_GOOGLE_SECRET:

correct
GOTRUE_EXTERNAL_GOOGLE_REDIRECT_URI:

matches Google Console

Supabase config.toml:

 toml
[auth]
site_url = "http://localhost:3000"
additional_redirect_urls = ["https://localhost:3000"]

[auth.external.google]
enabled = true
client_id = "env(SUPABASE_AUTH_EXTERNAL_GOOGLE_CLIENT_ID)"
secret = "env(SUPABASE_AUTH_EXTERNAL_GOOGLE_SECRET)"
redirect_uri = ""
skip_nonce_check = true

 toml
[auth]
site_url = "http://localhost:3000"
additional_redirect_urls = ["https://localhost:3000"]

[auth.external.google]
enabled = true
client_id = "env(SUPABASE_AUTH_EXTERNAL_GOOGLE_CLIENT_ID)"
secret = "env(SUPABASE_AUTH_EXTERNAL_GOOGLE_SECRET)"
redirect_uri = ""
skip_nonce_check = true

 toml
[auth]
site_url = "http://localhost:3000"
additional_redirect_urls = ["https://localhost:3000"]

[auth.external.google]
enabled = true
client_id = "env(SUPABASE_AUTH_EXTERNAL_GOOGLE_CLIENT_ID)"
secret = "env(SUPABASE_AUTH_EXTERNAL_GOOGLE_SECRET)"
redirect_uri = ""
skip_nonce_check = true

 toml
[auth]
site_url = "http://localhost:3000"
additional_redirect_urls = ["https://localhost:3000"]

[auth.external.google]
enabled = true
client_id = "env(SUPABASE_AUTH_EXTERNAL_GOOGLE_CLIENT_ID)"
secret = "env(SUPABASE_AUTH_EXTERNAL_GOOGLE_SECRET)"
redirect_uri = ""
skip_nonce_check = true

Next.js Server Action:

 typescript
export async function loginWithGoogle() {
  const supabase = await createClient()
  
  const { data, error } = await supabase.auth.signInWithOAuth({
    provider: 'google',
  })
  
  if (error) {
    redirect('/unauthorized')
  }
  
  if (data.url) {
    redirect(data.url)
  }
}

 typescript
export async function loginWithGoogle() {
  const supabase = await createClient()
  
  const { data, error } = await supabase.auth.signInWithOAuth({
    provider: 'google',
  })
  
  if (error) {
    redirect('/unauthorized')
  }
  
  if (data.url) {
    redirect(data.url)
  }
}

 typescript
export async function loginWithGoogle() {
  const supabase = await createClient()
  
  const { data, error } = await supabase.auth.signInWithOAuth({
    provider: 'google',
  })
  
  if (error) {
    redirect('/unauthorized')
  }
  
  if (data.url) {
    redirect(data.url)
  }
}

 typescript
export async function loginWithGoogle() {
  const supabase = await createClient()
  
  const { data, error } = await supabase.auth.signInWithOAuth({
    provider: 'google',
  })
  
  if (error) {
    redirect('/unauthorized')
  }
  
  if (data.url) {
    redirect(data.url)
  }
}

Has anyone encountered this specific "Bad request" error with Google OAuth in local Supabase development? Any insights would be greatly appreciated!

Google OAuth "Bad request" error on local development with Supabase CLI

Similar Threads

Similar Threads

Similar Threads