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