使用 Google 帳戶登入功能

以下是使用「使用 Google 帳戶登入」的主要功能。您可以使用程式碼產生器產生程式碼,將 One Tap、自動登入和「使用 Google 帳戶登入」按鈕嵌入網頁。

使用者可以在支援 FedCM 的瀏覽器上,全面停用第三方登入功能。使用者選擇停用後,系統就會停用 One Tap 和自動登入功能,並不會顯示這兩項功能。

One Tap

當使用者造訪您的網站時,如果瀏覽器中有有效的 Google 工作階段,系統可能會提示使用者透過 Google 帳戶登入或註冊網站。只要輕觸一次 (單一 Google 工作階段) 或兩次 (有多個 Google 工作階段),使用者就能完成聯合登入或註冊流程。由於所有使用者體驗流程都是在網頁中嵌入的 iframe 中執行,因此 One Tap 使用者體驗可提供順暢的使用者進入點。

One Tap 彈出式視窗要求使用者同意並登入

使用者可以選擇在全球停用 One Tap。在這種情況下,Google 帳戶不會顯示 One Tap。如果所有有效的 Google 帳戶都選擇停用,系統就不會顯示 One Tap UI。

建議您在主要登入對話方塊和子頁面中都加入 One Tap。開發人員偏好使用 One Tap 的原因有很多:

  • 使用者轉換率提升。如要進一步瞭解部分合作夥伴如何成功運用 One Tap 改善註冊和登入體驗,請參閱個案研究
  • 允許登入和註冊,但不會將使用者重新導向至專屬的登入和註冊頁面。
  • 使用者可以在您的網站情境中登入及註冊,不必離開目前的瀏覽歷程。
  • 透過個人化提示和自動登入功能,減少重複帳戶的情況。

自動登入

透過 One Tap,您也可以啟用可取消的自動登入功能,為回訪使用者提供簡化版的使用者體驗。只要使用者沒有做出任何動作,系統就會自動登入網站。如果只有一個有效的 Google 帳戶先前同意將帳戶個人資料分享給您的應用程式,系統就會觸發自動登入功能。

使用者可以在短時間內取消自動登入程序,確保使用者可自行控制及查看相關資訊。如果使用者取消自動登入功能,系統會記住這項決定,並在一天後再次啟用自動登入功能。使用者可透過可取消功能,進一步控管自動登入程序。

啟用 FedCM 後,自動登入事件之間會有 10 分鐘的等待期。如果在這個時間內觸發自動登入功能,使用者會遵循 One Tap 登入流程,而非自動登入流程。

使用「使用 Google 帳戶登入」功能登入網頁版應用程式時,系統不會顯示任何 UI,而是直接傳回憑證。當 Google 將登入憑證傳回給依賴方時,使用者一律會看到某些 UI,並可手動或自動登入。這有助於提升使用者的隱私權和控管權。

使用 Google One Tap 自動登入提示

您需要根據自家網站的使用者體驗,決定是否要啟用自動登入功能。

「使用 Google 帳戶登入」按鈕

與 One Tap 不同,使用者必須透過手勢觸發「使用 Google 帳戶登入」按鈕流程。為此,Google 登入功能只提供用於顯示按鈕的 API,而非用於以程式輔助方式啟動按鈕流程的 API。開發人員只需在網頁上顯示「使用 Google 帳戶登入」按鈕即可。程式庫會以透明的方式處理觸發按鈕 UX 流程的時機。

未個人化的登入按鈕

換句話說,現在「使用 Google 帳戶登入」按鈕必須由 Google Identity 服務 JavaScript 程式庫產生。按鈕轉譯 API 可讓您自訂顏色、形狀、文字和大小,以符合網站的品牌宣傳規定,同時仍遵守 Google 的規範。在各個網站上使用一致的按鈕,使用者就能快速辨識、信任並使用這些按鈕。

您也可以使用使用者個人資料資訊來顯示按鈕。只有在至少有一個有效的 Google 工作階段曾在您的網站上驗證使用者時,系統才會顯示個人化按鈕。個人化按鈕可提醒使用者先前曾使用「使用 Google 帳戶登入」功能,進而避免在網站上不必要地建立重複帳戶。這項功能對偶爾造訪網站的使用者來說特別實用。他們可能會忘記自己使用的登入方式。

個人化登入按鈕

除了個人化按鈕外,使用 Google 帳戶登入按鈕也支援透過 Family Link 管理的 Google 帳戶,並遵循機構管理員設定的 Google Workspace 政策。

「使用 Google 帳戶登入」按鈕流程支援彈出式和重新導向的使用者體驗模式。

  • 在彈出式使用者體驗中,只要點選「使用 Google 帳戶登入」按鈕,網頁頂端就會開啟新的彈出式視窗。按鈕使用者體驗流程會在彈出式視窗中顯示。
  • 在重新導向使用者體驗中,點選「使用 Google 帳戶登入」按鈕後,系統會重新導向至整個網頁。按鈕使用者體驗流程會在同一個視窗中顯示。不過,使用者在按鈕使用者介面顯示時,將無法再看到您的網頁。

使用者可以撤銷同意分享 ID 權杖的同意聲明。「透過 Google 帳戶登入」提供 API,可透過程式碼撤銷使用者同意聲明。

與 Google 身分識別服務授權 API 中的 revoke() 方法不同,您不需要存取權存證來撤銷使用者同意聲明。不過,您必須提供目標 Google 工作階段的電子郵件地址Google 使用者 ID,且瀏覽器中應有該帳戶的有效 Google 工作階段。

撤銷 API 會撤銷 ID 權杖共用功能,以及先前授予的任何其他授權範圍。無論您使用哪個撤銷 API,情況一律如此。

程式碼產生器

程式碼產生器是開發人員工具,可協助您產生用戶端整合程式碼。使用「使用 Google 帳戶登入」HTML API 時,您可能不需要任何 JavaScript 程式碼來進行用戶端整合。

程式碼產生器步驟 1:設定

如果您選擇使用 JavaScript API,建議您使用程式碼產生器以互動方式設計按鈕。您也可以先產生 HTML 程式碼,然後將程式碼複製到 JavaScript API 中的對應欄位。