本頁說明如何實作相關功能,讓使用者透過 Google One Tap 登入或登出。
自動登入使用者
Google One Tap 支援自動登入功能,可讓使用者返回網站時直接登入,不必手動操作,提供順暢的使用者體驗。使用者不必記得上次造訪時選取的 Google 帳戶,減少在您平台上建立不必要重複帳戶的機率。
自動登入功能旨在輔助「使用 Google 帳戶登入」按鈕和 One Tap 對話方塊。這項功能適用於整個網站,使用者必須先登出網站,才能手動註冊或切換帳戶。
如要自動登入,必須符合下列條件:
- 使用者必須先登入 Google 帳戶,且
- 先前已同意與您的應用程式分享帳戶個人資料,且
- 使用 FedCM 時,過去 10 分鐘內只嘗試登入一次。 如果在這段時間內重複嘗試登入,系統就會顯示「輕觸一下」登入提示。
- 使用 FedCM 時,即使使用者在 FedCM 推出前已核准網站,Chrome 仍會要求使用者在每個 Chrome 執行個體中,重新確認是否要使用 Google 帳戶登入網站。這項變更可能會影響使用 One Tap 的現有網站轉換率。在 Chrome M121 更新中,自動登入功能改善可減少轉換率下降的問題。
如果網頁已啟用自動登入功能,且符合上述條件,系統就會自動傳回使用者的 ID 權杖憑證,使用者無需進行任何操作。如果未符合這些條件,即使網頁已啟用自動登入功能,使用者預設也會透過「One Tap」流程登入或同意。如果使用者有多個 Google 帳戶,且造訪您的網站,他們必須先登入單一 Google 帳戶,並同意該帳戶的條款。
您可以使用傳回憑證物件的 select_by 欄位中的 auto 值,評估自動登入成功率。
如要啟用自動登入功能,請在程式碼中加入 data-auto_select="true",如下列程式碼片段所示:
<div id="g_id_onload"
data-client_id="YOUR_GOOGLE_CLIENT_ID"
data-login_uri="https://your.domain/your_login_endpoint"
data-auto_select="true">
</div>
登出
使用者登出網站時,系統可以將他們導向至自動顯示 Google One Tap 提示的頁面。如要進行這項設定,必須禁止自動選取。否則,使用者會自動重新登入,導致 UX 進入死循環。
使用 FedCM
為提升使用者體驗,每次自動登入嘗試之間會有 10 分鐘的靜止期。在這段期間,系統會改為顯示 One Tap 提示。使用者必須明確點選「一鍵登入」才能登入。
未使用 FedCM
如要禁止使用者登出後自動選取帳戶,請將類別名稱 g_id_signout 新增至所有登出連結和按鈕。請參閱下列程式碼片段:
<div class="g_id_signout">Sign Out</div>
您也可以使用下列 JavaScript 程式碼片段登出:
const button = document.getElementById('signout_button');
button.onclick = () => {
google.accounts.id.disableAutoSelect();
}
為避免 UX 進入無限迴圈,使用者登出狀態會儲存在名為 g_state 的 Cookie 中,這個 Cookie 是由 Google Identity 服務程式庫設定。根據預設,Cookie 網域會設為目前網頁的網域。如果父網域和子網域都顯示「One Tap」,狀態 Cookie 就必須在所有網域中顯示。使用 data-state_cookie_domain 屬性將 g_state Cookie 網域設為父項網域。舉例來說,請為 example.com 的父項網域和名為 webapp.example.com 的子網域,將 data-state_cookie_domain="example.com" 新增至 g_id_onload 元素。
如果您有服務會監控網域中使用的所有 Cookie,請通知他們 g_state Cookie。
如果不想在登入後頁面載入用戶端程式庫,請使用下列解決方案,避免登出後發生無限迴圈 UX:
- 登出時,將使用者重新導向至不顯示「一鍵登入」的頁面 (例如
https://example.com/logged_out),或一律停用自動登入的頁面。 - 登出時,請在網址中加入參數。例如:
logged_out=1。使用 JavaScript API 轉譯 One Tap 時,請檢查網址參數,並在出現時停用自動登入功能。
主要使用者歷程
自動登入頁面。
使用 FedCM
使用者可以點選「X」X按鈕關閉「一鍵登入」提示。為顧及無障礙功能,即使使用者點選「X」X按鈕,系統仍會將 ID 權杖分享給您的網站。
為提升使用者體驗,每次自動登入嘗試之間會有 10 分鐘的靜止期。在這段期間,系統會改為顯示 One Tap 提示。使用者必須明確點選「一鍵登入」才能登入。
未使用 FedCM

如果使用者在 5 秒內未點選「取消」按鈕,系統就會將 ID 權杖分享給您的網站。
取消登入時,系統會根據有效的 Google 工作階段數量,顯示帳戶選擇工具頁面或回訪者頁面。
- 多個 Google 工作階段

- 單次 Google 課程
