01
Supabase 實戰
Google OAuth 整合

Supabase 串接 Google 登入

Authentication·OAuth 整合·Google Cloud Platform

Google Cloud Console 設定

步驟 1:建立 Google Cloud 專案

2

[新增專案] → 填入專案名稱 → 進入專案

步驟 2:啟用 Google+ API

3

前往 [API 和服務] → [程式庫] → 搜尋 [Google+ API] → 點擊並啟用該 API

步驟 3:設定 OAuth 同意畫面

重要提醒

先設定同意畫面,才能建立 OAuth 用戶端 ID

4

前往 [API 和服務] → [憑證] → [設定同意畫面] → 填完應用程式名稱與電子郵件,目標對象選外部

步驟 4:建立 OAuth 用戶端 ID

5

點擊 [建立憑證] → [OAuth 用戶端 ID] → 選擇應用程式類型:[網路應用程式] 與設定名稱

Supabase Dashboard 設定

取得 Callback URL

進入 Supabase Dashboard 畫面:

[Authentication] → [Sign In / Providers] → [Google] → 複製 Callback URL (for OAuth)

設定重新導向 URI

回到 Google Cloud Console:

已授權的重新導向 URI 填入剛剛複製的 URL

例如:https://your-supabase-project.supabase.co/auth/v1/callback
重要資訊

完成設定後可以取得用戶端 ID用戶端密鑰

完成 Supabase 設定

回到 Supabase Dashboard:

[Authentication] → [Sign In / Providers] → [Google]

填入從 Google Cloud Console 取得的:

  • Client ID
  • Client Secret (for OAuth)

設定完成

🎉 Google OAuth 整合完成

現在您可以在應用程式中使用 Google 登入功能了

Supabase Auth Google OAuth Authentication