本章將帶你從零開始設定 Google Cloud Console 與 Supabase Authentication,完成 Google 第三方登入串接。
1 Google Cloud Console 設定
首先需要建立 Google 專案並取得 OAuth 憑證:
1. 建立專案
前往 Google Cloud Console,建立一個新專案。
2. 啟用 API
搜尋並啟用 Google+ API (或是 Google People API)。這是取得用戶資訊所必須的。
3. 設定 OAuth 同意畫面
前往 API 和服務 > OAuth 同意畫面。
- User Type 選擇:外部 (External)
- 填寫應用程式名稱與聯絡人資訊
- 儲存並繼續
4. 建立憑證
前往 憑證 > 建立憑證 > OAuth 用戶端 ID。
- 應用程式類型:網頁應用程式
- 名稱:自訂 (例如 My Supabase App)
注意:「已授權的重新導向 URI」先留空,等一下從 Supabase 取得後再回來填寫。
2 Supabase Dashboard 設定
現在回到 Supabase 進行設定:
取得 Callback URL
進入 Supabase 專案,前往 Authentication > Providers > Google。
複製最上方的 Callback URL (for OAuth)。
回填 Google Console
回到 Google Cloud Console 的憑證設定頁面,將此 URL 貼入「已授權的重新導向 URI (Authorized redirect URIs)」,並儲存。
3 完成串接
最後一步,將 Google 的憑證資訊填入 Supabase:
從 Google Console 取得:
- 用戶端編號 (Client ID)
- 用戶端密鑰 (Client Secret)
回到 Supabase > Authentication > Providers > Google:
- 貼上 Client ID
- 貼上 Client Secret
- 啟用 (Enable Google) switch
- 按下 Save
🎉 恭喜!你已經成功啟用了 Google 登入功能。