在網站中加入「使用 Google 帳戶登入」、「一鍵登入」或自動登入功能前，請先設定 OAuth 設定，並視需要設定網站內容安全性政策。
取得 Google API 用戶端 ID
如要為您的網站啟用「使用 Google 帳戶登入」功能，您必須先設定 Google API 用戶端 ID。若要這樣做，請完成下列步驟：
- 開啟 Cloud Shell 的「Credentials」(憑證) 頁面， Google API 控制台。
- 建立或選取 Google API 專案。如果您已經有專案 「使用 Google 帳戶登入」按鈕或「Google One Tap」選項，使用現有專案 和網路用戶端 ID建立正式版應用程式時 可能需要多項專案，請重複其餘步驟 您也能建立 Cloud Storage 值區
- 按一下「Create credentials」(建立憑證) >OAuth 用戶端 ID和應用程式類型 選取「網頁應用程式」來建立新的用戶端 ID。如要使用現有的用戶端 ID，請選取「網頁應用程式」類型。
將您網站的 URI 加入「已授權的 JavaScript 來源」。URI 只包含通訊協定和完整主機名稱。例如
https://www.example.com。您也可以選擇使用重新導向到您端點來傳回憑證 而非透過 JavaScript 回呼。如果出現這種情況，請將 將重新導向 URI 連結至已授權的重新導向 URI。重新導向 URI 包含配置、完整主機名稱和路徑，且必須符合重新導向 URI 驗證規則。例如：
https://www.example.com/auth-receiver
設定 OAuth 同意畫面
使用「使用 Google 帳戶登入」和「一鍵驗證」驗證方式時，都會顯示同意畫面，告知使用者應用程式要求存取其資料，以及要求存取哪些資料，以及適用的條款。
- 開啟 Google 開發人員控制台「API 和服務」部分的「OAuth 同意畫面」頁面。
- 如果出現提示，請選取您剛建立的專案。
在「OAuth 同意畫面」頁面中填寫表單，然後按一下「Save」(儲存) 按鈕。
應用程式名稱：要求同意的應用程式名稱。名稱應準確反映您的應用程式，並與使用者在其他地方看到的應用程式名稱一致。
應用程式標誌：這張圖片會顯示在同意畫面上，藉此提供協助 幫助使用者認識您的應用程式標誌顯示在「使用 Google 帳戶登入」中 同意畫面和帳戶設定，但不會顯示在 One Tap 對話方塊中。
支援電子郵件：會顯示在同意畫面中，以便使用者尋求支援，以及向 G Suite 管理員評估其使用者對應用程式的存取權。使用者點選應用程式名稱時，系統會在「使用 Google 帳戶登入」同意聲明畫面上顯示這個電子郵件地址。
Google API 的範圍：範圍可讓應用程式存取使用者的私人資料。對於驗證，預設範圍 (電子郵件、設定檔、openid) 就足夠了，您不需要新增任何敏感範圍。一般來說，最佳做法是在需要存取權時，逐漸要求範圍，而非一開始就要求。瞭解詳情
授權網域：為保障您與使用者的安全，Google 只允許應用程式透過 OAuth 驗證使用授權網域。您的應用程式連結必須由授權網域代管。 瞭解詳情。
應用程式首頁連結：顯示「使用 Google 帳戶登入」同意聲明 以及「一鍵啟用 GDPR 符合 GDPR 規範」的免責事項資訊 「以下列身分繼續登入」按鈕。必須存放在授權網域中。
應用程式隱私權政策連結：「使用 Google 帳戶登入」會顯示 「同意畫面」，以及「一觸即享 GDPR 合規」的免責事項資訊 「以<使用者名稱>的身分繼續」按鈕。必須存放在授權網域中。
應用程式服務條款連結 (選用)：顯示在「登入時」 Google 同意畫面和「一鍵式 GDPR 符合 GDPR 規範」的免責事項資訊 ，在「以下列身分繼續」下按鈕。必須存放在授權網域中。
如果應用程式需要進行驗證，請查看「驗證狀態」，然後 按一下 [送交驗證]按下這個按鈕提出申請 驗證。詳情請參閱 OAuth 驗證規定 。
登入時顯示 OAuth 設定
One Tap 使用 FedCM
頂層網域授權網域會顯示在 。
One Tap (不使用 FedCM)
在使用者同意期間，系統會顯示「Application name」。
圖 1. One Tap 在 Chrome 顯示的 OAuth 同意聲明設定。
內容安全政策
雖然不是必要，但建議您使用內容安全政策，確保應用程式安全並防範跨網站指令碼 (XSS) 攻擊。詳情請參閱「CSP 簡介」和「CSP 和 XSS」。
您的內容安全政策可能包含一或多個指令，例如
connect-src、frame-src、script-src、style-src 或 default-src。
如果 CSP 包含：
connect-src指令，新增https://accounts.google.com/gsi/以允許 頁面，載入 Google Identity Services 伺服器端的上層網址 端點。frame-src指令，新增https://accounts.google.com/gsi/以允許 One Tap 和「使用 Google 帳戶登入」按鈕 iframe 的上層網址。script-src指令，請新增https://accounts.google.com/gsi/client以允許 Google Identity 服務 JavaScript 程式庫的網址。style-src指令，請新增https://accounts.google.com/gsi/style來允許 Google 身分識別服務樣式表單的網址。- 如果使用
default-src指令，則在未指定任何前述指令 (connect-src、frame-src、script-src或style-src) 的情況下，會使用https://accounts.google.com/gsi/讓網頁載入 Google 身分識別服務伺服器端端點的父項網址。
使用 connect-src 時，請避免列出個別的 GIS 網址。這有助於在更新 GIS 時盡量減少失敗情形。舉例來說
https://accounts.google.com/gsi/status 使用 GIS 上層網址
https://accounts.google.com/gsi/。
這個回應標頭允許 Google Identity 服務載入及執行 成功：
Content-Security-Policy-Report-Only: script-src
https://accounts.google.com/gsi/client; frame-src
https://accounts.google.com/gsi/; connect-src https://accounts.google.com/gsi/;
跨來源開發者政策
「使用 Google 帳戶登入」按鈕和 Google One Tap 功能可能需要變更
訂單數：Cross-Origin-Opener-Policy (COOP)
即可成功建立彈出式視窗
啟用 FedCM 後，瀏覽器會直接轉譯彈出式視窗，因此不需要進行任何變更。
不過，如果停用 FedCM，請設定 COOP 標頭：
- 傳送至
same-origin和 - 加入
same-origin-allow-popups。
如果未能設定正確的標頭，就會中斷視窗間的通訊， 空白彈出式視窗 或類似錯誤