このリファレンス ページでは、「Google でログイン」の HTML data Attributes API について説明します。API を使用して、ワンタップ プロンプトや [Google でログイン] ボタンをウェブページに表示できます。
ID が「g_id_onload」の要素
「Google でログイン」のデータ属性は、表示可能または非表示の要素（<div> や <span> など）に配置できます。唯一の要件は、要素 ID が g_id_onload に設定されていることです。この ID を複数の要素に追加しないでください。
データ属性
次の表に、データ属性とその説明を示します。
| 属性 | |
|---|---|
data-client_id |
アプリケーションのクライアント ID |
data-auto_prompt |
Google One のタップ操作が表示されている。 |
data-auto_select |
Google One Tap の自動選択を有効にします。 |
data-login_uri |
ログイン エンドポイントの URL |
data-callback |
JavaScript ID トークン ハンドラ関数名 |
data-native_login_uri |
パスワード認証情報ハンドラ エンドポイントの URL |
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 |
ワンタップ プロンプトのコンテナ要素の DOM ID |
data-skip_prompt_cookie |
指定された Cookie が空以外の値である場合、ワンタップをスキップします。 |
data-nonce |
ID トークンのランダムな文字列 |
data-context |
ワンタップ プロンプトのタイトルと語句 |
data-moment_callback |
プロンプト UI ステータス通知リスナーの関数名 |
data-state_cookie_domain |
親ドメインとそのサブドメインでワンタップを呼び出す必要がある場合は、親ドメインをこの属性に渡して、単一の共有 Cookie が使用されるようにします。 |
data-ux_mode |
[Google でログイン] ボタンの UX フロー |
data-allowed_parent_origin |
中間 iframe の埋め込みを許可するオリジン。この属性が存在する場合、ワンタップは中間 iframe モードで実行されます。 |
data-intermediate_iframe_close_callback |
ユーザーが手動でワンタップを閉じたときに、デフォルトの中間 iframe の動作をオーバーライドします。 |
data-itp_support |
ITP ブラウザでワンタップ UX をアップグレードできます。 |
data-login_hint |
ユーザーヒントを提供してアカウントの選択をスキップします。 |
data-hd |
アカウントの選択をドメインごとに制限します。 |
data-use_fedcm_for_prompt |
ブラウザでユーザーのログイン プロンプトを制御し、ウェブサイトと Google 間のログインフローを仲介できるようにします。 |
属性タイプ
以降のセクションでは、各属性のタイプの詳細と例について説明します。
data-client_id
この属性はアプリのクライアント ID です。クライアント ID は Google Cloud コンソールで確認、作成されます。詳しくは、次の表をご覧ください。
| タイプ | 必須 | 例 |
|---|---|---|
| 文字列 | はい | data-client_id="CLIENT_ID.apps.googleusercontent.com" |
データ自動プロンプト
この属性を使用して、ワンタップを表示するかどうかを指定できます。デフォルト値は true です。この値が false の場合、Google One のタップは表示されません。詳しくは、次の表をご覧ください。
| タイプ | 必須 | 例 |
|---|---|---|
| boolean | 任意 | data-auto_prompt="true" |
データ自動選択
この属性は、1 つの Google セッションのみがアプリを承認した場合に、ユーザーによる操作なしで ID トークンを自動的に返すかどうかを決定します。デフォルト値は false です。詳しくは、次の表をご覧ください。
| タイプ | 必須 | 例 |
|---|---|---|
| boolean | 任意 | data-auto_select="true" |
data-login_uri
この属性は、ログイン エンドポイントの URI です。
この値は、API Console で構成した OAuth 2.0 クライアントで承認済みのリダイレクト URI のいずれかと完全に一致し、リダイレクト URI の検証ルールに準拠している必要があります。
現在のページがログインページである場合は、この属性を省略できます。ログインページの場合、認証情報はデフォルトでこのページに送信されます。
コールバック関数が定義されていない場合に、ユーザーが [Google でログイン] ボタンまたはワンタップ ボタンをクリックするか、自動署名が行われた場合、ID トークン認証情報のレスポンスがログイン エンドポイントに送信されます。
詳しくは、次の表をご覧ください。
| タイプ | 任意 | 例 |
|---|---|---|
| URL | デフォルトは、現在のページの URI または指定した値になります。data-ux_mode="popup" と data-callback が設定されている場合は無視されます。 |
data-login_uri="https://www.example.com/login" |
ログイン エンドポイントは、本文に ID トークン値を持つ credential キーを含む POST リクエストを処理する必要があります。
ログイン エンドポイントへのリクエストの例を次に示します。
POST /login HTTP/1.1
Host: www.example.com
Content-Type: application/x-www-form-urlencoded
credential=ID_TOKEN
データ コールバック
この属性は、返された ID トークンを処理する JavaScript 関数の名前です。詳しくは、次の表をご覧ください。
| タイプ | 必須 | 例 |
|---|---|---|
| 文字列 | data-login_uri が設定されていない場合は必須です。 |
data-callback="handleToken" |
data-login_uri 属性または data-callback 属性のいずれかを使用できます。以下のコンポーネントと UX モードの構成によって異なります。
data-login_uri属性は、[Google でログイン] ボタンredirectUX モードに必要です。UX モードではdata-callback属性は無視されます。Google One Tap と Google ログインボタン
popupUX モードに対して、これら 2 つの属性のいずれかを設定する必要があります。両方を設定した場合、data-callback属性が優先されます。
名前空間内の JavaScript 関数は、HTML API ではサポートされていません。代わりに、名前空間を指定せずにグローバル JavaScript 関数を使用します。たとえば、mylib.callback ではなく mylibCallback を使用します。
data-native_login_uri
この属性は、パスワード認証情報ハンドラ エンドポイントの URL です。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 属性を設定すると、Google セッションがないときに JavaScript ライブラリはネイティブの認証情報マネージャーにフォールバックします。data-native_callback と data-native_login_uri の両方を設定することはできません。詳細については、次の表をご覧ください。
| タイプ | 必須 | 例 |
|---|---|---|
| 文字列 | 任意 | data-native_callback="handlePasswordCredential" |
名前空間内の JavaScript 関数は、HTML API ではサポートされていません。代わりに、名前空間を指定せずにグローバル JavaScript 関数を使用します。たとえば、mylib.callback ではなく mylibCallback を使用します。
data-native_id_param
パスワード認証情報をパスワード認証情報ハンドラ エンドポイントに送信するときに、credential.id フィールドにパラメータ名を指定できます。デフォルト名は email です。詳しくは、次の表をご覧ください。
| タイプ | 必須 | 例 |
|---|---|---|
| URL | 任意 | data-native_id_param="user_id" |
data-native_password_param
パスワード認証情報をパスワード認証情報ハンドラ エンドポイントに送信するときに、credential.password 値にパラメータ名を指定できます。デフォルト名は password です。詳しくは、次の表をご覧ください。
| タイプ | 必須 | 例 |
|---|---|---|
| URL | 任意 | data-native_password_param="pwd" |
data-cancel_on_tap_outside
この属性は、ユーザーがプロンプト以外の場所をクリックした場合にワンタップ リクエストをキャンセルするかどうかを設定します。デフォルト値は true です。無効にするには、値を false に設定します。詳しくは、次の表をご覧ください。
| タイプ | 必須 | 例 |
|---|---|---|
| boolean | 任意 | data-cancel_on_tap_outside="false" |
data-prompt_parent_id
コンテナ要素の DOM ID を設定します。設定されていない場合は、ウィンドウの右上にワンタップ プロンプトが表示されます。詳しくは、次の表をご覧ください。
| タイプ | 必須 | 例 |
|---|---|---|
| 文字列 | 任意 | data-prompt_parent_id="parent_id" |
data-skip_prompt_cookie
この属性は、指定された Cookie が空以外の値である場合、ワンタップをスキップします。詳しくは、次の表をご覧ください。
| タイプ | 必須 | 例 |
|---|---|---|
| 文字列 | 任意 | data-skip_prompt_cookie="SID" |
データノンス
この属性は、リプレイ攻撃を防ぐために ID トークンで使用されるランダムな文字列です。詳しくは、次の表をご覧ください。
| タイプ | 必須 | 例 |
|---|---|---|
| 文字列 | 任意 | data-nonce="biaqbm70g23" |
ノンスの長さは、環境でサポートされている JWT の最大サイズと、個々のブラウザとサーバーの HTTP サイズの制約に制限されます。
データ コンテキスト
この属性により、ワンタップ プロンプトに表示されるタイトルのテキストとメッセージが変更されます。詳しくは、次の表をご覧ください。
| タイプ | 必須 | 例 |
|---|---|---|
| 文字列 | 任意 | data-context="use" |
次の表に、使用可能なすべてのコンテキストとその説明を示します。
| 背景情報 | |
|---|---|
signin |
「Google でログイン」 |
signup |
「Google で登録」 |
use |
「Google で使用」 |
data-moment_callback
この属性は、プロンプト UI ステータス通知リスナーの関数名です。詳細については、データ型 PromptMomentNotification をご覧ください。
詳しくは、次の表をご覧ください。
| タイプ | 必須 | 例 |
|---|---|---|
| 文字列 | 任意 | data-moment_callback="logMomentNotification" |
名前空間内の JavaScript 関数は、HTML API ではサポートされていません。代わりに、名前空間を指定せずにグローバル JavaScript 関数を使用します。たとえば、mylib.callback ではなく mylibCallback を使用します。
data-state_cookie_domain
親ドメインとそのサブドメインでワンタップを表示する必要がある場合は、親ドメインをこの属性に渡して、単一の共有状態の Cookie が使用されるようにします。詳しくは、次の表をご覧ください。
| タイプ | 必須 | 例 |
|---|---|---|
| 文字列 | 任意 | data-state_cookie_domain="example.com" |
data-ux_mode
この属性では、[Google でログイン] ボタンで使用される UX フローを設定します。デフォルト値は popup です。この属性はワンタップの UX には影響しません。詳しくは、次の表をご覧ください。
| タイプ | 必須 | 例 |
|---|---|---|
| 文字列 | 任意 | data-ux_mode="redirect" |
次の表に、利用可能な UX モードとその説明を示します。
| UX モード | |
|---|---|
popup |
ポップアップ ウィンドウでログイン UX フローを実行します。 |
redirect |
ページ全体のリダイレクトでログイン UX フローを実行します。 |
data-allowed_parent_origin
中間 iframe の埋め込みを許可するオリジン。この属性が存在する場合、ワンタップは中間 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 モードのワンタップの初期化が失敗し、停止します。
ワイルドカードの接頭辞もサポートされています。たとえば、"https://*.example.com" は example.com とそのサブドメインにすべてのレベル（news.example.com、login.news.example.com など）で一致します。ワイルドカードを使用する際は、次の点に注意してください。
- パターン文字列は、ワイルドカードとトップレベル ドメインだけで構成することはできません。たとえば、
https://*.comとhttps://*.co.ukは無効です。前述のとおり、"https://*.example.com"はexample.comとそのサブドメインと一致します。カンマ区切りのリストを使用して 2 つの異なるドメインを表すこともできます。たとえば、"https://example1.com,https://*.example2.com"はドメインexample1.com、example2.com、およびexample2.comのサブドメインに一致します。 - ワイルドカード ドメインは安全な https:// スキームで始まる必要があるため、
"*.example.com"は無効と見なされます。
data-intermediate_iframe_close_callback
ユーザーがワンタップ UI の [X] ボタンをタップしてワンタップを手動で閉じたときに、デフォルトの中間 iframe の動作をオーバーライドします。デフォルトの動作では、DOM から中間 iframe がすぐに削除されます。
data-intermediate_iframe_close_callback フィールドは、中間 iframe モードでのみ有効になります。これはワンタップ iframe ではなく
中間 iframe にのみ影響しますコールバックが呼び出される前に、ワンタップ UI が削除されます。
| タイプ | 必須 | 例 |
|---|---|---|
| 機能 | 任意 | data-intermediate_iframe_close_callback="logBeforeClose" |
名前空間内の JavaScript 関数は、HTML API ではサポートされていません。代わりに、名前空間を指定せずにグローバル JavaScript 関数を使用します。たとえば、mylib.callback ではなく mylibCallback を使用します。
data-itp_support
このフィールドは、
アップグレードされたワンタップ UX をインテリジェント トラッキング防止機能（ITP）をサポートしているブラウザで有効にするかどうかを決定します。デフォルト値は false です。詳しくは、次の表をご覧ください。
| タイプ | 必須 | 例 |
|---|---|---|
| boolean | 任意 | data-itp_support="true" |
data-login_hint
ログインするユーザーを事前にアプリが認識している場合は、ログインのヒントを Google に提供できます。成功した場合、アカウントの選択はスキップされます。指定できる値は、メールアドレスまたは ID トークンの sub フィールドです。
詳細については、
login_hint の OpenID Connect ドキュメントをご覧ください。
| タイプ | 必須 | 例 |
|---|---|---|
文字列。メールアドレス、または ID トークンの sub フィールド値を指定できます。 |
任意 | data-login_hint="elisa.beckett@gmail.com" |
データ HD
ユーザーが複数のアカウントを持ち、Workspace アカウントでのみログインする必要がある場合は、これを使用してドメイン名のヒントを Google に提供します。成功すると、アカウントの選択中に表示されるユーザー アカウントは、指定したドメインに限定されます。ワイルドカード値: * は、ユーザーに Workspace アカウントのみを提供し、アカウントの選択時に一般ユーザー向けアカウント（user@gmail.com）は除外します。
詳細については、
hd の OpenID Connect ドキュメントをご覧ください。
| タイプ | 必須 | 例 |
|---|---|---|
| 文字列。完全修飾ドメイン名または *。 | 任意 | data-hd="*" |
data-use_fedcm_for_prompt
ブラウザでユーザーのログイン プロンプトを制御し、ウェブサイトと Google 間のログインフローを仲介できるようにします。デフォルトは false です。詳細については、FedCM への移行ページをご覧ください。
| タイプ | 必須 | 例 |
|---|---|---|
| boolean | 任意 | data-use_fedcm_for_prompt="true" |
クラス「g_id_signin」を含む要素
要素の class 属性に g_id_signin を追加すると、要素は [Google でログイン] ボタンとしてレンダリングされます。
同じページに複数の [Google でログイン] ボタンを表示できます。各ボタンには独自の表示設定を指定できます。設定は、次のデータ属性によって定義されます。
ビジュアル データの属性
次の表に、視覚的なデータ属性とその説明を示します。
| 属性 | |
|---|---|
data-type |
ボタンのタイプ: アイコンまたは標準ボタン。 |
data-theme |
ボタンのテーマ。たとえば、fill_blue や filled_black です。 |
data-size |
ボタンのサイズ。たとえば、S サイズや L サイズなどです。 |
data-text |
ボタンのテキスト。例: 「Google でログイン」や「Google で登録」。 |
data-shape |
ボタンの形状。（長方形や円形など）。 |
data-logo_alignment |
Google ロゴの配置（左または中央）。 |
data-width |
ボタンの幅（ピクセル単位）。 |
data-locale |
ボタンのテキストは、この属性で設定した言語でレンダリングされます。 |
data-click_listener |
設定すると、この関数は「Google でログイン」ボタンがクリックされたときに呼び出されます。 |
data-state |
設定すると、この文字列は ID トークンを返します。 |
属性タイプ
以降のセクションでは、各属性のタイプの詳細と例について説明します。
データ型
ボタンのタイプ。デフォルト値は 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 |
|
データテキスト
ボタンのテキスト。デフォルト値は signin_with です。data-text 属性が異なるアイコンボタンのテキストに、見た目の違いはありません。唯一の例外は、画面ユーザー補助機能のためにテキストを読み取っている場合です。
詳しくは、次の表をご覧ください。
| タイプ | 必須 | 例 |
|---|---|---|
| 文字列 | 任意 | data-text="signup_with" |
次の表に、使用可能なボタンテキストとその説明を示します。
| テキスト | |
|---|---|
signin_with |
|
signup_with |
![[Google で登録] というラベルの標準ボタン](https://developers-dot-devsite-v2-prod.appspot.com/static/identity/gsi/web/images/standard-button-signup.png?authuser=00&hl=ja)
|
continue_with |
![[Google で続行] というラベルの標準ボタン](https://developers-dot-devsite-v2-prod.appspot.com/static/identity/gsi/web/images/standard-button-continue.png?authuser=00&hl=ja)
|
signin |
![[ログイン] というラベルの標準ボタン](https://developers-dot-devsite-v2-prod.appspot.com/static/identity/gsi/web/images/standard-button-signin.png?authuser=00&hl=ja)
|
データ形態
ボタンの形状。デフォルト値は rectangular です。詳しくは、次の表をご覧ください。
| タイプ | 必須 | 例 |
|---|---|---|
| 文字列 | 任意 | data-shape="rectangular" |
次の表に、使用可能なボタンの形状とその説明を示します。
| 形 | |
|---|---|
rectangular |
icon ボタンタイプに使用する場合は、square と同じです。 |
pill |
icon ボタンタイプに使用する場合は、circle と同じになります。 |
circle |
standard ボタンタイプに使用する場合は、pill と同じです。 |
square |
standard ボタンタイプに使用する場合は、rectangular と同じです。 |
データロゴの配置
Google ロゴの配置。デフォルト値は left です。この属性は standard ボタンタイプにのみ適用されます。詳しくは、次の表をご覧ください。
| タイプ | 必須 | 例 |
|---|---|---|
| 文字列 | 任意 | data-logo_alignment="center" |
次の表に、使用可能なアライメントとその説明を示します。
| logo_alignment | |
|---|---|
left |
|
center |
|
データ幅
ボタンの最小幅（ピクセル単位）。使用できる最大幅は 400 ピクセルです。
詳しくは、次の表をご覧ください。
| タイプ | 必須 | 例 |
|---|---|---|
| 文字列 | 任意 | data-width=400 |
データ ロケール
省略可。指定した言語 / 地域を使用してボタンテキストを表示します。それ以外の場合は、ユーザーの 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 でログイン] ボタンがクリックされると、「Google でログイン」ボタンをクリックしましたというメッセージがコンソールに記録されます。
data-state
（省略可）同じページに複数の [Google でログイン] ボタンをレンダリングできるため、各ボタンに一意の文字列を割り当てることができます。同じ文字列が ID トークンとともに返されるため、ユーザーがログインするためにクリックしたボタンを特定できます。
詳しくは、次の表をご覧ください。
| タイプ | 必須 | 例 |
|---|---|---|
| 文字列 | 任意 | data-state="button 1" |
サーバーサイドの統合
サーバーサイド エンドポイントは、次の HTTP POST リクエストを処理する必要があります。
ID トークン ハンドラ エンドポイント
ID トークン ハンドラ エンドポイントが ID トークンを処理します。対応するアカウントのステータスに基づいて、ユーザーをログインさせ、登録ページまたはアカウント リンク ページにリダイレクトして詳細情報を確認できます。
HTTP POST リクエストには次の情報が含まれます。
| 形式 | 名前 | 説明 |
|---|---|---|
| Cookie | g_csrf_token |
ハンドラ エンドポイントへのリクエストごとに変化するランダムな文字列。 |
| リクエスト パラメータ | g_csrf_token |
以前の Cookie 値（g_csrf_token）と同じ文字列。 |
| リクエスト パラメータ | credential |
Google が発行する 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 アカウントのグローバルに一意の識別子です。sub フィールドはすべての Google アカウントの中で一意であり、再利用されないため、ユーザーの識別子としてのみ使用します。Google アカウントは異なる時点で複数のメールアドレスを持つ可能性があるため、メールアドレスを識別子として使用しないでください。
email、email_verified、hd フィールドを使用すると、Google がメールアドレスをホストしていて、メールアドレスの権限があるかどうかを確認できます。Google が正式な権限である場合、ユーザーは正規のアカウント所有者であると確認されます。
Google が信頼できるケース:
emailには@gmail.comというサフィックスが付いています。これは Gmail アカウントです。email_verifiedが true で、hdが設定されている。これは Google Workspace アカウントです。
ユーザーは、Gmail や Google Workspace を使用せずに Google アカウントに登録できます。email に @gmail.com サフィックスが含まれておらず、hd が存在しない場合、Google は権威ではないため、パスワードまたはその他の方法でユーザーを確認することをおすすめします。また、Google アカウントの作成時に Google が最初にユーザーを確認したため、email_verified が true になることもあります。ただし、サードパーティのメール アカウントの所有権はその後変更されている可能性があります。
exp フィールドには、サーバーサイドでトークンを確認する有効期限が表示されます。「Google でログイン」から取得した ID トークンは 1 時間です。有効期限が切れる前にトークンを検証する必要があります。セッション管理に exp を使用しないでください。ID トークンが期限切れになっても、ユーザーがログアウトされるわけではありません。ユーザーのセッション管理はアプリ側で行います。
select_by
select_by フィールドに指定可能な値を次の表に示します。値の設定には、使用するボタンの種類、セッションおよび同意ステータス、
ユーザーがワンタップまたは「Google でログイン」ボタンを押したか、タッチレスの自動ログイン プロセスを使用した。
既存のセッションが検出されたか、ユーザーが Google アカウントを選択してログインして新しいセッションを確立しました。
ID トークンの認証情報をアプリと共有する前に、ユーザーは
- [確認] ボタンを押して認証情報の共有に同意する または
- [アカウントを選択]を使って Google アカウントを選択したことを 確認します
このフィールドの値は、次のいずれかのタイプに設定されます。
| 値 | 説明 |
|---|---|
auto |
認証情報の共有に同意済みの既存のセッションでのユーザーの自動ログイン。FedCM に対応していないブラウザにのみ適用されます。 |
user |
以前に同意した既存のセッションがあるユーザーが、ワンタップの [次の名前とメールアドレスで続行] ボタンを押して認証情報を共有。FedCM に対応していないブラウザにのみ適用されます。 |
fedcm |
ユーザーが FedCM を使用して認証情報を共有するために、ワンタップの [次の名前とメールアドレスで続行] ボタンを押しました。FedCM でサポートされているブラウザにのみ適用されます。 |
fedcm_auto |
FedCM ワンタップを使用して認証情報を共有することに同意していた、既存のセッションでのユーザーの自動ログイン。FedCM でサポートされているブラウザにのみ適用されます。 |
user_1tap |
既存のセッションがあるユーザーがワンタップの [次の名前とメールアドレスで続行] ボタンを押して、同意し、認証情報を共有。Chrome v75 以降にのみ適用されます。 |
user_2tap |
既存のセッションを持たないユーザーが、ワンタップの [次の名前とメールアドレスで続行] ボタンを押してアカウントを選択し、ポップアップ ウィンドウで [確認] ボタンを押して同意を許可し、認証情報を共有。Chromium ベースではないブラウザに適用されます。 |
btn |
以前に同意した既存のセッションがあるユーザーが、[Google でログイン] ボタンをクリックし、[アカウントの選択] で Google アカウントを選択して認証情報を共有している。 |
btn_confirm |
既存のセッションがあるユーザーが [Google でログイン] ボタンを押し、確認ボタンを押して、同意を承諾して認証情報を共有しています。 |
btn_add_session |
以前に同意した既存のセッションを持たないユーザーが、[Google でログイン] ボタンをクリックして Google アカウントを選択し、認証情報を共有しました。 |
btn_confirm_add_session |
既存のセッションがないユーザーは、まず [Google でログイン] ボタンをクリックして Google アカウントを選択し、次に [確認] ボタンを押して同意と認証情報の共有を行いました。 |
state
このパラメータは、ユーザーがログインのために [Google でログイン] ボタンをクリックしてログインし、クリックされるボタンの data-state 属性が指定されている場合にのみ定義されます。このフィールドの値は、ボタンの data-state 属性で指定した値と同じです。
同じページに複数の「Google でログイン」ボタンをレンダリングできるため、各ボタンに一意の文字列を割り当てることができます。したがって、この state パラメータを使用して、ユーザーがログインするためにクリックしたボタンを特定できます。
パスワード認証情報ハンドラ エンドポイント
パスワード認証情報ハンドラ エンドポイントは、ネイティブ認証情報マネージャーが取得するパスワード認証情報を処理します。
HTTP POST リクエストには次の情報が含まれます。
| 形式 | 名前 | 説明 |
|---|---|---|
| Cookie | g_csrf_token |
ハンドラ エンドポイントへのリクエストごとに変化するランダムな文字列。 |
| リクエスト パラメータ | g_csrf_token |
以前の Cookie 値（g_csrf_token）と同じ文字列。 |
| リクエスト パラメータ | email |
Google が発行するこの ID トークン。 |
| リクエスト パラメータ | password |
クルデンシャルが選択される方法。 |