設定 Google 帳號登入會員功能

啟用 Google 登入功能可大幅降低註冊門檻,提升網站會員轉換率。本篇教學將引導您進入 Google Cloud Platform (GCP) 申請 API 憑證,並正確串接至網站後台。

一、Google Cloud Platform 專案與憑證設定

Step 1 登入 Google API Dashboard

請前往 Google API Console,登入您的 Google 帳號並同意服務條款。

登入 Google API Dashboard

Step 2 建立新專案

點選 建立專案。設定專案名稱(限英文),完成後點擊「建立」。

建立新專案

Step 3 切換並確認專案

點選「選取專案」選單,切換至您剛剛建立的專案名稱並點擊「開啟」。

選取專案1 選取專案2
狀態確認: 確保左上方顯示的專案名稱正確。
專案切換成功

Step 4 設定 OAuth 同意畫面

🚀 操作路徑: 憑證 建立憑證 OAuth 用戶端 ID

點選「設定同意畫面」,User Type 選擇 外部 後點擊「建立」。

建立 OAuth 同意畫面

Step 5 填寫應用程式註冊資訊

依序填入應用程式名稱、支援電子郵件、已授權網域與開發人員聯絡資訊,完成後儲存。

填寫應用程式資訊

Step 6 新增重新導向 URI

再次點擊「建立憑證」>「OAuth 用戶端 ID」,類型選「網頁應用程式」,並點擊「+ 新增 URI」。

💡 URI 取得方式: 前往網站後台:會員專區社群登入設定 複製 URI 網址。
後台 URI 位置

二、取得金鑰與網站後台串接

Step 7 擷取用戶端 ID 與密碼

複製系統產生的 用戶端 ID用戶端密碼

複製 API 金鑰

Step 8 後台串接與儲存

🚀 操作路徑: 會員專區 社群登入設定 Google 登入

將代碼貼入後台對應欄位並點擊 儲存

後台金鑰儲存

Step 9 前台測試

前往前台登入頁面測試,若成功跳出 Google 授權視窗即完成串接!

前台測試登入