本參考頁面說明「Sign In with Google」HTML 資料屬性 API。您可以使用 API 在網頁上顯示「One Tap」提示或「使用 Google 帳戶登入」按鈕。
ID 為「g_id_onload」的元素
您可以在任何可見或不可見的元素中加入「使用 Google 帳戶登入」資料屬性,例如 <div>
和 <span>
。唯一的要求是元素 ID 必須設為 g_id_onload
。請勿將這個 ID 放在多個元素上。
資料屬性
下表列出資料屬性及其說明:
屬性 | |
---|---|
data-client_id |
應用程式的用戶端 ID |
data-color_scheme |
套用至 One Tap 提示的色彩配置。 |
data-auto_prompt |
顯示 Google One 輕觸按鈕。 |
data-auto_select |
啟用 Google One Tap 的自動選取功能。 |
data-login_uri |
登入端點的網址 |
data-callback |
JavaScript ID 權杖處理常式函式名稱 |
data-native_login_uri |
密碼憑證處理常式端點的網址 |
data-native_callback |
JavaScript 密碼憑證處理常式函式名稱 |
data-native_id_param |
credential.id 值的參數名稱 |
data-native_password_param |
credential.password 值的參數名稱 |
data-cancel_on_tap_outside |
控制在使用者點選提示之外的區域時,是否要取消提示。 |
data-prompt_parent_id |
One Tap 提示訊息容器元素的 DOM ID |
data-skip_prompt_cookie |
如果指定的 Cookie 含有非空值,就略過 One Tap。 |
data-nonce |
ID 權杖的隨機字串 |
data-context |
One Tap 提示中的標題和文字 |
data-moment_callback |
提示 UI 狀態通知事件監聽器的函式名稱 |
data-state_cookie_domain |
如果您需要在父網域及其子網域中呼叫 One Tap,請將父網域傳遞至這個屬性,以便使用單一共用 Cookie。 |
data-ux_mode |
「使用 Google 帳戶登入」按鈕的使用者體驗流程 |
data-allowed_parent_origin |
允許嵌入中介 iframe 的來源。如果有這項屬性,One Tap 就會在中繼 iframe 模式下執行。 |
data-intermediate_iframe_close_callback |
當使用者手動關閉 One Tap 時,會覆寫預設的中介 iframe 行為。 |
data-itp_support |
在 ITP 瀏覽器上啟用升級版 One Tap 使用者體驗。 |
data-login_hint |
提供使用者提示,略過帳戶選取程序。 |
data-hd |
依網域限制帳戶選取範圍。 |
data-use_fedcm_for_prompt |
允許瀏覽器控管使用者登入提示,並調解網站和 Google 之間的登入流程。 |
data-use_fedcm_for_button |
這個欄位會決定是否應在 Chrome 上使用 FedCM 按鈕使用者體驗 (桌面版 M125 以上版本和 Android M128 以上版本)。預設為 false 。 |
data-button_auto_select |
是否為 FedCM 按鈕流程啟用「自動選取」選項。如果啟用這項功能,擁有有效 Google 工作階段的回訪使用者會自動登入,而不會出現帳戶選擇器提示。預設值為 false 。 |
屬性類型
以下各節將詳細說明每個屬性的類型和範例。
data-client_id
這個屬性是應用程式的用戶端 ID,您可以在 Google Cloud 控制台中找到並建立這個 ID。詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
字串 | 是 | data-client_id="CLIENT_ID.apps.googleusercontent.com" |
data-color_scheme
這個欄位是套用至 One Tap 提示的色彩配置。詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
字串 | (選用步驟) 預設為使用者的系統預設色彩配置。 | data-color_scheme="dark" |
下表列出可用的配色方案及其說明。
色彩配置 | |
---|---|
default |
根據使用者偏好的色彩配置 (淺色或深色),套用使用者系統的預設色彩配置。 |
light |
套用淺色色彩配置。 |
dark |
套用深色色彩配置。 |
data-auto_prompt
這項屬性會決定是否顯示 One Tap。預設值為 true
。如果這個值為 false
,系統就不會顯示 Google One Tap。詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
布林值 | 選用 | data-auto_prompt="true" |
data-auto_select
如果只有一個 Google 工作階段核准您的應用程式,這個屬性會決定是否要在沒有任何使用者互動的情況下,自動傳回 ID 權杖。預設值為 false
。詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
布林值 | 選用 | data-auto_select="true" |
data-login_uri
這個屬性是登入端點的 URI。
這個值必須與 OAuth 2.0 用戶端的其中一個授權重新導向 URI 完全相符,您可以在 Google Auth Platform 中設定這類 URI,且必須符合重新導向 URI 驗證規則。
如果目前的網頁是登入頁面,則可以省略這個屬性,因為系統會預設將憑證發布到這個頁面。
如果未定義回呼函式,且使用者點選「使用 Google 帳戶登入」或「One Tap」按鈕,或自動登入,系統就會將 ID 權杖憑證回應張貼至登入端點。
登入端點必須處理含有 credential
參數的 POST 要求,且要求主體中必須含有 ID 權杖值。
詳情請參閱下表:
類型 | 選用 | 範例 |
---|---|---|
網址 | 預設為目前網頁的 URI,或您指定的值。 如果已設定 data-ux_mode="popup" 和 data-callback ,則會遭到忽略。 |
data-login_uri="https://www.example.com/login" |
data-callback
這個屬性是負責處理傳回 ID 權杖的 JavaScript 函式名稱。詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
字串 | 如果未設定 data-login_uri ,則為必要欄位。 |
data-callback="handleToken" |
可能會使用 data-login_uri
和 data-callback
其中一個屬性。取決於下列元件和 UX 模式設定:
data-login_uri
屬性是「使用 Google 帳戶登入」按鈕redirect
UX 模式的必要屬性,該模式會忽略data-callback
屬性。您必須為 Google One Tap 和 Google 登入按鈕
popup
UX 模式設定這兩個屬性中的其中一個。如果兩者都設有值,則data-callback
屬性的優先順序會較高。
HTML API 不支援命名空間中的 JavaScript 函式。請改用不含命名空間的全域 JavaScript 函式。例如,使用 mylibCallback
而非 mylib.callback
。
data-native_login_uri
這個屬性是密碼憑證處理程序端點的網址。如果您設定 data-native_login_uri
屬性或 data-native_callback
屬性,在沒有 Google 工作階段時,JavaScript 程式庫會改用內建的憑證管理工具。您無法同時設定 data-native_callback
和 data-native_login_uri
屬性。詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
字串 | 選用 | data-login_uri="https://www.example.com/password_login" |
data-native_callback
這個屬性是 JavaScript 函式的名稱,負責處理從瀏覽器內建憑證管理工具傳回的密碼憑證。如果您設定 data-native_login_uri
屬性或 data-native_callback
屬性,JavaScript 程式庫會在沒有 Google 工作階段時,改用內建的憑證管理工具。您無法同時設定 data-native_callback
和 data-native_login_uri
。詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
字串 | 選用 | data-native_callback="handlePasswordCredential" |
HTML API 不支援命名空間中的 JavaScript 函式。請改用不含命名空間的全域 JavaScript 函式。例如,使用 mylibCallback
而非 mylib.callback
。
data-native_id_param
將密碼憑證提交至密碼憑證處理常式端點時,您可以為 credential.id
欄位指定參數名稱。預設名稱為 email
。詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
網址 | 選用 | data-native_id_param="user_id" |
data-native_password_param
將密碼憑證提交至密碼憑證處理程序端點時,您可以為 credential.password
值指定參數名稱。預設名稱為 password
。詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
網址 | 選用 | data-native_password_param="pwd" |
data-cancel_on_tap_outside
這項屬性可設定在使用者點選提示訊息外部時,是否要取消 One Tap 要求。預設值為 true
。如要停用,請將值設為 false
。詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
布林值 | 選用 | data-cancel_on_tap_outside="false" |
data-prompt_parent_id
這個屬性會設定容器元素的 DOM ID。如果未設定,視窗的右上角會顯示「One Tap」提示。詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
字串 | 選用 | data-prompt_parent_id="parent_id" |
data-skip_prompt_cookie
使用 Cookie 控制 One Tap 提示的顯示方式。如果此屬性指定的 Cookie 值非空白,系統就不會顯示提示。詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
字串 | 選用 | data-skip_prompt_cookie="SID" |
data-nonce
這項屬性是 ID 權杖用來防範重播攻擊的隨機字串。詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
字串 | 選用 | data-nonce="biaqbm70g23" |
Nonce 長度受限於環境支援的 JWT 大小上限,以及個別瀏覽器和伺服器 HTTP 大小限制。
data-context
這個欄位會變更 One Tap 提示中顯示的標題和訊息文字,但對 ITP 瀏覽器沒有影響。預設值為 signin
。
詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
字串 | 選用 | data-context="use" |
下表列出所有可用上下文及其說明:
背景資訊 | |
---|---|
signin |
「Sign in to」 |
signup |
「Sign up to」 |
use |
「使用」 |
data-moment_callback
這個屬性是提示 UI 狀態通知事件監聽器的函式名稱。詳情請參閱資料類型 PromptMomentNotification
。
詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
字串 | 選用 | data-moment_callback="logMomentNotification" |
HTML API 不支援命名空間中的 JavaScript 函式。請改用不含命名空間的全域 JavaScript 函式。例如,使用 mylibCallback
而非 mylib.callback
。
data-state_cookie_domain
如果您需要在父網域及其子網域中顯示 One Tap,請將父網域傳遞至此屬性,以便使用單一共用狀態 Cookie。詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
字串 | 選用 | data-state_cookie_domain="example.com" |
data-ux_mode
這項屬性會設定「使用 Google 帳戶登入」按鈕使用的使用者體驗流程。預設值為 popup
。這個屬性不會對 One Tap 使用者體驗造成影響。詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
字串 | 選用 | data-ux_mode="redirect" |
下表列出可用的 UX 模式及其說明。
使用者體驗模式 | |
---|---|
popup |
在彈出式視窗中執行登入使用者體驗流程。 |
redirect |
透過完整頁面重新導向執行登入使用者體驗流程。 |
data-allowed_parent_origin
允許嵌入中介 iframe 的來源。如果有這個屬性,One Tap 就會在中介 iframe 模式下執行。詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
字串或字串陣列 | 選用 | data-allowed_parent_origin="https://example.com" |
下表列出支援的值類型及其說明。
值類型 | ||
---|---|---|
string |
單一網域 URI。 | 「https://example.com」 |
string array |
以逗號分隔的網域 URI 清單。 | "https://news.example.com,https://local.example.com" |
如果 data-allowed_parent_origin
屬性的值無效,中繼 iframe 模式的 One Tap 初始化作業就會失敗並停止。
也支援萬用字元前置字元。舉例來說,"https://*.example.com"
會比對 example.com
及其所有層級的子網域 (例如 news.example.com
、login.news.example.com
)。使用萬用字元時,請注意下列事項:
- 模式字串不得僅由萬用字元和頂層網域組成。舉例來說,
https://.com
和https://
.co.uk
無效,因為"https://.example.com"
會與example.com
和所有子網域相符。使用以半形逗號分隔的清單,代表兩個不同的網域。例如,"https://example1.com,https://
.example2.com"
會比對網域example1.com
、example2.com
和example2.com
的子網域。 - 萬用字元網域的開頭必須是安全的 https:// 通訊協定,因此
"*.example.com"
會被視為無效。
data-intermediate_iframe_close_callback
當使用者輕觸 One Tap UI 中的「X」按鈕,手動關閉 One Tap 時,會覆寫預設的中介 iframe 行為。預設行為是立即從 DOM 中移除中介 iframe。
data-intermediate_iframe_close_callback
欄位只會在中介 iframe 模式中生效。而且,這項設定只會影響中繼 iframe,而非 One Tap iframe。在叫用回呼之前,系統會移除 One Tap UI。
類型 | 必填 | 範例 |
---|---|---|
函式 | 選用 | data-intermediate_iframe_close_callback="logBeforeClose" |
HTML API 不支援命名空間中的 JavaScript 函式。請改用不含命名空間的全域 JavaScript 函式。例如,使用 mylibCallback
而非 mylib.callback
。
data-itp_support
這個欄位會決定是否應在支援智慧防追蹤 (ITP) 的瀏覽器上啟用
升級版 One Tap UX。預設值為 false
。詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
布林值 | 選用 | data-itp_support="true" |
data-login_hint
如果應用程式事先知道應登入哪位使用者,就可以向 Google 提供登入提示。成功後,系統會略過帳戶選取程序。可接受的值包括電子郵件地址或 ID 權杖 sub 欄位。
詳情請參閱
login_hint
的 OpenID Connect 說明文件。
類型 | 必填 | 範例 |
---|---|---|
字串。可以是電子郵件地址,或是 ID 權杖中的 sub 欄位值。 |
選用 | data-login_hint="elisa.beckett@gmail.com" |
data-hd
如果使用者擁有多個帳戶,且只應登入 Workspace 帳戶,請使用這個選項向 Google 提供網域名稱提示。成功後,在帳戶選取期間顯示的使用者帳戶會限制在提供的網域內。萬用字元值:*
會在帳戶選取期間,只向使用者提供 Workspace 帳戶,並排除消費者帳戶 (user@gmail.com)。
詳情請參閱
hd
的 OpenID Connect 說明文件。
類型 | 必填 | 範例 |
---|---|---|
字串。完整網域名稱或 *。 | 選用 | data-hd="*" |
data-use_fedcm_for_prompt
允許瀏覽器控管使用者登入提示,並調解網站和 Google 之間的登入流程。預設值為 false。詳情請參閱「遷移至 FedCM」頁面。
類型 | 必填 | 範例 |
---|---|---|
布林值 | 選用 | data-use_fedcm_for_prompt="true" |
data-use_fedcm_for_button
這個欄位會決定是否應在 Chrome (桌面版 M125 以上版本和 Android M128 以上版本) 中使用 FedCM 按鈕使用者體驗。預設值為 false
。詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
布林值 | 選用 | data-use_fedcm_for_button="true" |
data-button_auto_select
這個欄位會決定是否為 FedCM 按鈕流程啟用「自動選取」選項。如果啟用這項功能,擁有有效 Google 工作階段的回訪使用者會自動登入,不必經過帳戶選擇器提示。預設為 false
。您必須在選擇啟動時明確啟用按鈕自動登入功能。詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
布林值 | 選用 | data-button_auto_select="true" |
類別為「g_id_signin」的元素
如果您將 g_id_signin
新增至元素的 class
屬性,元素會顯示為「Sign In With Google」按鈕。
您可以在同一個網頁上顯示多個「使用 Google 帳戶登入」按鈕。每個按鈕都可以有專屬的視覺設定。這些設定由下列資料屬性定義。
視覺資料屬性
下表列出視覺資料屬性及其說明:
屬性 | |
---|---|
data-type |
按鈕類型:圖示或標準按鈕。 |
data-theme |
按鈕主題。例如 filled_blue 或 filled_black。 |
data-size |
按鈕大小。例如小或大。 |
data-text |
按鈕文字。例如「使用 Google 帳戶登入」或「使用 Google 帳戶註冊」。 |
data-shape |
按鈕形狀。例如矩形或圓形。 |
data-logo_alignment |
Google 標誌對齊方式:靠左或置中。 |
data-width |
按鈕的寬度,以像素為單位。 |
data-locale |
按鈕文字會以此屬性中設定的語言顯示。 |
data-click_listener |
如果已設定,系統會在使用者點選「Sign In With Google」按鈕時呼叫此函式。 |
data-state |
如果已設定,這個字串會隨 ID 權杖傳回。 |
屬性類型
以下各節將詳細說明每個屬性的類型和範例。
data-type
按鈕類型。預設值為 standard
。詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
字串 | 是 | data-type="icon" |
下表列出所有可用的按鈕類型及其說明:
類型 | |
---|---|
standard |
![]() ![]() |
icon |
![]() |
data-theme
按鈕主題。預設值為 outline
。詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
字串 | 選用 | data-theme="filled_blue" |
下表列出可用的主題及其說明:
主題 | |
---|---|
outline |
![]() ![]() ![]() |
filled_blue |
![]() ![]() ![]() |
filled_black |
![]() ![]() ![]() |
data-size
按鈕大小。預設值為 large
。詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
字串 | 選用 | data-size="small" |
下表列出可用的按鈕大小及其說明。
大小 | |
---|---|
large |
![]() ![]() ![]() |
medium |
![]() ![]() |
small |
![]() ![]() |
data-text
按鈕文字。預設值為 signin_with
。具有不同 data-text
屬性的圖示按鈕文字,在視覺上沒有差異。唯一的例外狀況是為了螢幕輔助功能而讀取文字。
詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
字串 | 選用 | data-text="signup_with" |
下表列出可用的按鈕文字及其說明:
文字 | |
---|---|
signin_with |
![]() ![]() |
signup_with |
![]() ![]() |
continue_with |
![]() ![]() |
signin |
![]() ![]() |
data-shape
按鈕形狀。預設值為 rectangular
。詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
字串 | 選用 | data-shape="rectangular" |
下表列出可用的按鈕形狀及其說明:
圖案 | |
---|---|
rectangular |
![]() ![]() ![]() icon 按鈕類型,則與 square 相同。 |
pill |
![]() ![]() ![]() icon 按鈕類型,則與 circle 相同。 |
circle |
![]() ![]() ![]() standard 按鈕類型,則與 pill 相同。 |
square |
![]() ![]() ![]() standard 按鈕類型,則與 rectangular 相同。 |
data-logo_alignment
Google 標誌的對齊方式。預設值為 left
。這個屬性僅適用於 standard
按鈕類型。詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
字串 | 選用 | data-logo_alignment="center" |
下表列出可用的對齊方式及其說明:
logo_alignment | |
---|---|
left |
![]() |
center |
![]() |
data-width
按鈕的寬度下限 (以像素為單位)。寬度上限為 400 像素。
詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
字串 | 選用 | data-width=400 |
data-locale
(選用步驟) 使用指定語言代碼顯示按鈕文字,否則會預設為使用者的 Google 帳戶或瀏覽器設定。載入程式庫時,請將 hl
參數和語言代碼新增至 src 指令,例如:gsi/client?hl=<iso-639-code>
。
如果未設定,系統會使用瀏覽器的預設語言代碼或 Google 工作階段使用者的偏好設定。因此,不同使用者可能會看到不同的本地化按鈕版本,且可能有不同的大小。
詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
字串 | 選用 | data-locale="zh_CN" |
data-click_listener
您可以使用 data-click_listener
屬性,定義在使用者點選「使用 Google 帳戶登入」按鈕時要呼叫的 JavaScript 函式。
<script> function onClickHandler(){ console.log("Sign in with Google button clicked...") } </script> ..... <div class="g_id_signin" data-size="large" data-theme="outline" data-click_listener="onClickHandler"> </div>
在這個範例中,點選「使用 Google 帳戶登入」按鈕時,系統會將「Sign in with Google button clicked...」訊息記錄到控制台。
data-state
選用:由於同一個網頁上可以顯示多個「使用 Google 帳戶登入」按鈕,您可以為每個按鈕指派專屬字串。系統會將相同的字串與 ID 權杖一併傳回,方便您識別使用者點選哪個按鈕登入。
詳情請參閱下表:
類型 | 必填 | 範例 |
---|---|---|
字串 | 選用 | data-state="button 1" |
伺服器端整合
您的伺服器端端點必須處理下列 HTTP POST
要求。
ID 權杖處理器端點
ID 權杖處理程序端點會處理 ID 權杖。根據對應帳戶的狀態,您可以讓使用者登入,並將他們導向註冊頁面或帳戶連結頁面,以便取得更多資訊。
以下是要求登入端點的範例:
POST /login HTTP/1.1
Content-Type: application/x-www-form-urlencoded
Cookie: g_csrf_token=<RANDOM_STRING>
Host: www.example.com
credential=<JWT_ENCODED_ID_TOKEN>&g_csrf_token=<RANDOM_STRING>
HTTP POST
要求包含下列資訊:
格式 | 名稱 | 說明 |
---|---|---|
Cookie | g_csrf_token |
隨 data-login_uri 指定的登入端點每項要求而變更的隨機字串,必須與 g_csrf_token 要求參數中的值相符。 |
要求參數 | g_csrf_token |
隨 data-login_uri 指定的登入端點的每個要求而變更的隨機字串,必須與 g_csrf_token Cookie 的值相符。 |
要求參數 | credential |
Google 核發的經過編碼的 JWT ID 權杖。 |
要求參數 | select_by |
使用者登入的方式。 |
要求參數 | state |
只有在使用者按一下「使用 Google 帳戶登入」按鈕登入,且指定按鈕的 state 屬性時,才會定義這個參數。 |
憑證
經過解碼後,ID 權杖會如下所示:
header { "alg": "RS256", "kid": "f05415b13acb9590f70df862765c655f5a7a019e", // JWT signature "typ": "JWT" } payload { "iss": "https://accounts.google.com", // The JWT's issuer "nbf": 161803398874, "aud": "314159265-pi.apps.googleusercontent.com", // Your server's client ID "sub": "3141592653589793238", // The unique ID of the user's Google Account "hd": "gmail.com", // If present, the host domain of the user's GSuite email address "email": "elisa.g.beckett@gmail.com", // The user's email address "email_verified": true, // true, if Google has verified the email address "azp": "314159265-pi.apps.googleusercontent.com", "name": "Elisa Beckett", // If present, a URL to user's profile picture "picture": "https://lh3.googleusercontent.com/a-/e2718281828459045235360uler", "given_name": "Eliza", "family_name": "Beckett", "iat": 1596474000, // Unix timestamp of the assertion's creation time "exp": 1596477600, // Unix timestamp of the assertion's expiration time "jti": "abc161803398874def" }
sub
欄位是 Google 帳戶的全域專屬 ID。僅使用 sub
欄位做為使用者的 ID,因為該 ID 在所有 Google 帳戶中是唯一的,且不會重複使用。
您可以使用 email
、email_verified
和 hd
欄位,判斷 Google 是否為電子郵件地址的代管服務器,以及是否為該地址的權威來源。如果 Google 是權威來源,則使用者會被確認為合法的帳戶擁有者。
Google 具有權威性的情況:
email
有@gmail.com
後置字串,表示這是 Gmail 帳戶。- 如果
email_verified
為 true 且hd
已設定,則表示這是 Google Workspace 帳戶。
使用者可以註冊 Google 帳戶,而無須使用 Gmail 或 Google Workspace。如果 email
不含 @gmail.com
後置字串,且 hd
不存在,Google 就不是權威來源,建議您使用密碼或其他驗證方法來驗證使用者。email_verified
也可能為 true,因為 Google 在建立 Google 帳戶時已驗證使用者,但第三方電子郵件帳戶的擁有權可能已變更。
exp
欄位會顯示到期時間,讓您在伺服器端驗證權杖。從「使用 Google 帳戶登入」取得的 ID 權杖則為一小時。您必須在到期時間前驗證權杖。請勿將 exp
用於工作階段管理。已過期的 ID 權杖不代表使用者已登出。您的應用程式負責管理使用者的工作階段。
g_csrf_token
防偽造狀態權杖。這是由 gsi/client
程式庫建立的跨網站偽造要求 (CSRF) 權杖。在 POST 酬載內容中,隨機值會同時以 Cookie 和要求參數的形式加入。如果在伺服器上處理要求時,這兩個值不相符,系統應將要求視為無效。
select_by
下表列出 select_by
欄位的可能值。系統會使用與工作階段和同意聲明狀態搭配使用的按鈕類型來設定值,
使用者按下「One Tap」或「使用 Google 帳戶登入」按鈕,或使用無觸控的自動登入程序。
系統找到現有工作階段,或使用者選取並登入 Google 帳戶,以建立新工作階段。
在與應用程式共用 ID 權杖憑證之前,使用者必須
- 按下「確認」按鈕,授權共用憑證。
- 先前已同意並使用「選取帳戶」功能選擇 Google 帳戶。
這個欄位的值會設為下列其中一種型別:
值 | 說明 |
---|---|
auto |
自動登入使用者,該使用者擁有現有工作階段,且先前已同意分享憑證。僅適用於非 FedCM 支援的瀏覽器。 |
user |
使用者擁有現有工作階段,先前已同意按下「繼續以身分」按鈕來分享憑證。僅適用於不支援 FedCM 的瀏覽器。 |
fedcm |
使用者按下 One Tap「繼續以身分」按鈕,透過 FedCM 分享憑證。僅適用於 FedCM 支援的瀏覽器。 |
fedcm_auto |
自動登入使用者,該使用者先前已同意使用 FedCM One Tap 共用憑證。僅適用於 FedCM 支援的瀏覽器。 |
user_1tap |
使用者在現有工作階段中按下 One Tap「繼續以身分」按鈕,授予同意聲明並分享憑證。僅適用於 Chrome 75 以上版本。 |
user_2tap |
使用者在沒有現有工作階段的情況下,按下 One Tap「繼續以」按鈕選取帳戶,然後按下彈出式視窗中的「確認」按鈕授予同意聲明並分享憑證。適用於非 Chromium 架構的瀏覽器。 |
btn |
使用者在先前同意授權後,已建立現有工作階段,並按下「使用 Google 帳戶登入」按鈕,從「選擇帳戶」中選取 Google 帳戶來分享憑證。 |
btn_confirm |
使用者在現有工作階段中按下「使用 Google 帳戶登入」按鈕,然後按下「確認」按鈕,授予同意並分享憑證。 |
btn_add_session |
使用者先前已同意授權,但目前沒有任何有效的工作階段,因此按下「使用 Google 帳戶登入」按鈕,選取 Google 帳戶並分享憑證。 |
btn_confirm_add_session |
使用者未有現有工作階段時,會先按下「使用 Google 帳戶登入」按鈕選取 Google 帳戶,然後按下「確認」按鈕同意並分享憑證。 |
州
只有在使用者點選「使用 Google 帳戶登入」按鈕登入時,系統才會定義這個參數,並指定所點選按鈕的 data-state
屬性。這個欄位的值與您在按鈕的 data-state
屬性中指定的值相同。
由於同一個網頁上可以顯示多個「使用 Google 帳戶登入」按鈕,因此您可以為每個按鈕指派專屬字串。因此,您可以使用這個 state
參數,找出使用者點按哪個按鈕登入。
密碼憑證處理程序端點
密碼憑證處理常式端點會處理內建憑證管理工具擷取的密碼憑證。
HTTP POST
要求包含下列資訊:
格式 | 名稱 | 說明 |
---|---|---|
Cookie | g_csrf_token |
隨 data-native_login_uri 指定的登入端點每項要求而變更的隨機字串,必須與 g_csrf_token 要求參數中的值相符。 |
要求參數 | g_csrf_token |
隨 data-native_login_uri 指定的登入端點的每個要求而變更的隨機字串,必須與 g_csrf_token Cookie 的值相符。 |
要求參數 | email |
這是 Google 核發的 ID 權杖。 |
要求參數 | password |
憑證的選取方式。 |