Google ログイン JavaScript クライアント リファレンス

このリファレンスでは、ウェブ アプリケーションで Google ログインを実装するために使用する JavaScript クライアント メソッドと属性について説明します。

ライブラリの使用中に問題が発生した場合は、GitHub リポジトリに報告してください。.

認証の設定

Google API プラットフォーム ライブラリを読み込んで gapi オブジェクトを作成します。

<script src="https://apis.google.com/js/platform.js?onload=init" async defer></script>

プラットフォーム ライブラリを読み込んだ後、auth2 ライブラリを読み込みます。

function init() {
  gapi.load('auth2', function() {
    /* Ready. Make a call to gapi.auth2.init or some other API */
  });
}

gapi.auth2.init(params)

GoogleAuth オブジェクトを初期化します。gapi.auth2.GoogleAuth のメソッドを呼び出す前に、このメソッドを呼び出す必要があります。

GoogleAuth オブジェクトを初期化するとき、OAuth 2.0 クライアント ID と追加オプションを指定してオブジェクトを構成します。ユーザーがすでにログインしている場合、GoogleAuth オブジェクトは前のセッションからユーザーのログイン状態を復元します。

引数
params クライアント構成データの Key-Value ペアを含むオブジェクト。構成可能なプロパティについては、gapi.auth2.ClientConfig をご覧ください。例:
{
  client_id: 'CLIENT_ID.apps.googleusercontent.com'
}
戻り値
gapi.auth2.GoogleAuth gapi.auth2.GoogleAuth オブジェクト。then() メソッドを使用して、gapi.auth2.GoogleAuth オブジェクトの初期化が完了したときに解決される Promise を取得します。

GoogleAuth.then(onInit, onError)

GoogleAuth オブジェクトが完全に初期化されると、onInit 関数を呼び出します。初期化中にエラーが発生した場合(古いサポートされていないブラウザで発生することがあります)、代わりに onError 関数が呼び出されます。

引数
onInit GoogleAuth オブジェクトが完全に初期化されたときに呼び出される関数。
onError GoogleAuth の初期化に失敗した場合、error プロパティを含むオブジェクトで呼び出される関数。
戻り値
Promise onInit 関数が完了したときに処理される Promise。初期化エラーが発生した場合は拒否されます。onInit 関数から返された値(ある場合)で解決されます。

エラーコード

idpiframe_initialization_failed
サポートされていない環境など、Google から必要な iframe を初期化できませんでした。details プロパティには、発生したエラーの詳細情報が含まれます。

gapi.auth2.ClientConfig

gapi.auth2.init メソッドのさまざまな構成パラメータを表すインターフェース。

パラメータ
client_id string 必須。Google API コンソールで検索して作成したアプリのクライアント ID。
cookie_policy string ログイン Cookie を作成するドメイン。URI、single_host_originnone のいずれか。指定しない場合のデフォルトは single_host_origin です。
scope string リクエストするスコープ(スペース区切りの文字列)。fetch_basic_profile が false に設定されていない場合は省略可能です。
fetch_basic_profile boolean ユーザーがログインしたときに、ユーザーの基本的なプロフィール情報を取得します。リクエストされたスコープに「profile」、「email」、「openid」を追加します。指定しない場合、true です。
hosted_domain string ユーザーがログインするために所属している必要がある G Suite ドメイン。これはクライアントによって変更される可能性があるため、返されたユーザーのホストドメイン プロパティを必ず確認してください。クライアントの GoogleUser.getHostedDomain() と、サーバーの ID トークンの hd クレームを使用して、ドメインが想定どおりであることを確認します。
use_fedcm boolean 省略可。デフォルトは True です。ログイン中のブラウザ FedCM API の使用を有効または無効にします。
ux_mode string ログインフローに使用する UX モード。デフォルトでは、ポップアップで同意フローが開きます。有効な値は popupredirect です。
redirect_uri string ux_mode='redirect' を使用する場合、このパラメータを使用すると、同意フローの終了時に使用されるデフォルトの redirect_uri をオーバーライドできます。デフォルトの redirect_uri は、クエリ パラメータとハッシュ フラグメントが削除された現在の URL です。
enable_granular_consent boolean 省略可。きめ細かい権限を有効にするかどうか。false に設定すると、2019 年より前に作成された OAuth クライアント ID に対して、より詳細な Google アカウントの権限が無効になります。2019 年以降に作成された OAuth クライアント ID には影響しません。これらの ID では、よりきめ細かい権限が常に有効になっているためです。
plugin_name string 省略可。この値が設定されている場合、2022 年 7 月 29 日より前に作成された新しいクライアント ID は、古い Google Platform ライブラリを使用できます。デフォルトでは、新しく作成されたクライアント ID は Platform Library の使用がブロックされ、代わりに新しい Google Identity Services ライブラリを使用する必要があります。任意の値を選択できますが、識別のためにプロダクト名やプラグイン名などのわかりやすい名前をおすすめします。例: plugin_name: 'YOUR_STRING_HERE'

認証

GoogleAuth は、ユーザーが Google アカウントでログインできるようにするメソッド、ユーザーの現在のログイン ステータスを取得するメソッド、ユーザーの Google プロフィールから特定のデータを取得するメソッド、追加のスコープをリクエストするメソッド、現在のアカウントからログアウトするメソッドを提供するシングルトン クラスです。

gapi.auth2.getAuthInstance()

GoogleAuth オブジェクトを返します。このメソッドを呼び出す前に、gapi.auth2.init()GoogleAuth オブジェクトを初期化する必要があります。

戻り値
gapi.auth2.GoogleAuth gapi.auth2.GoogleAuth オブジェクト。このオブジェクトを使用して、gapi.auth2.GoogleAuth のメソッドを呼び出します。

GoogleAuth.isSignedIn.get()

現在のユーザーがログインしているかどうかを返します。

戻り値
ブール値 ユーザーがログインしている場合は true、ユーザーがログアウトしている場合や GoogleAuth オブジェクトが初期化されていない場合は false

GoogleAuth.isSignedIn.listen(listener)

現在のユーザーのログイン状態の変化をリッスンします。

引数
listener ブール値を受け取る関数。listen() は、ユーザーがログインしたときに true をこの関数に渡し、ユーザーがログアウトしたときに false を渡します。

GoogleAuth.signIn()

gapi.auth2.init() に指定されたオプションを使用してユーザーをログインさせます。

戻り値
Promise ユーザーが正常に認証され、リクエストされたスコープが付与された場合は GoogleUser インスタンスで処理され、エラーが発生した場合は error プロパティを含むオブジェクトで拒否される Promise。エラーコードについては、次のセクションをご覧ください。

エラーコード

詳細については、GoogleAuth.signIn(options) をご覧ください。

GoogleAuth.signIn(options)

指定されたオプションを使用してユーザーをログインさせます。

引数
options 以下のいずれか:
  • ログイン パラメータの Key-Value ペアを含む gapi.auth2.SignInOptions オブジェクト。例:
    {
      scope: 'profile email'
    }
  • gapi.auth2.SigninOptionsBuilder のインスタンス。例:
    options = new gapi.auth2.SigninOptionsBuilder();
    options.setAppPackageName('com.example.app');
    options.setFetchBasicProfile(True);
    options.setPrompt('select_account');
    options.setScope('profile').setScope('email');
戻り値
Promise ユーザーがリクエストされたスコープを正常に認証して付与した場合は GoogleUser インスタンスで処理され、エラーが発生した場合は error プロパティを含むオブジェクトで拒否される Promise(エラーコードについては後述)。

エラーコード

popup_closed_by_user
ログイン フローを完了する前に、ユーザーがポップアップを閉じた。
access_denied
ユーザーが必要なスコープへの権限を拒否しました。
immediate_failed
同意フローを表示せずにユーザーを自動的に選択することはできません。prompt: 'none' オプションで signIn を使用するときにエラーが発生します。gapi.auth2.init は、以前のセッションでログインしたことがある場合はユーザーを自動的にログインさせるため、このオプションは使用する必要はありません。

gapi.auth2.SignInOptions

GoogleAuth.signIn(options) メソッドのさまざまな構成パラメータを表すインターフェース。

パラメータ
prompt string 同意フローに特定のモードを強制します。省略可。
値は次のとおりです。
  • consent
    認可サーバーは、ユーザーに同意を求めてから、アプリに情報を返します。
  • select_account
    認可サーバーは、Google アカウントを選択するようユーザーに求めます。これにより、複数のアカウントを持つユーザーは、現在のセッションがある複数のアカウントから選択できます。
  • none推奨されない
    認可サーバーは、認証画面やユーザーの同意画面を表示しません。ユーザーがまだ認証されておらず、リクエストされたスコープに同意していない場合は、エラーが返されます。
    gapi.auth2.init は、以前にログインしたユーザーをアプリケーションに自動的にログインさせるため、通常、signIn({prompt: 'none'}) の呼び出しは失敗します。
scope string gapi.auth2.init パラメータで定義されたスコープに加えて、リクエストするスコープ(スペース区切りの文字列)。fetch_basic_profile が false に設定されていない場合は省略可能です。
ux_mode string ログインフローに使用する UX モード。デフォルトでは、同意フローがポップアップで開きます。有効な値は popupredirect です。
redirect_uri string ux_mode='redirect' を使用する場合、このパラメータを使用すると、同意フローの終了時に使用されるデフォルトの redirect_uri をオーバーライドできます。デフォルトの redirect_uri は、クエリ パラメータとハッシュ フラグメントが削除された現在の URL です。

GoogleAuth.signOut()

現在のアカウントをアプリケーションからログアウトします。

戻り値
Promise ユーザーがログアウトしたときに実行される Promise

GoogleAuth.disconnect()

ユーザーが付与したすべてのスコープを取り消します。

GoogleAuth.grantOfflineAccess(options)

指定したスコープにオフラインでアクセスする権限をユーザーから取得します。

引数
options パラメータの Key-Value ペアを含む gapi.auth2.OfflineAccessOptions オブジェクト。例:
{
  scope: 'profile email'
}
戻り値
Promise ユーザーがリクエストされたスコープを付与すると実行される Promise。認証コードを含むオブジェクトを Promise のフルフィルメント ハンドラに渡します。例:
auth2.grantOfflineAccess().then(function(resp) {
  var auth_code = resp.code;
});

エラーコード

popup_closed_by_user
ユーザーが同意フローを完了する前にポップアップを閉じた。
access_denied
ユーザーが必要なスコープへの権限を拒否しました。
immediate_failed
同意フローを表示せずにユーザーを自動的に選択することはできません。prompt: 'none' オプションで signIn を使用するとエラーが発生します。gapi.auth2.init は、以前のセッションでログインしたことがある場合はユーザーを自動的にログインするため、このオプションを使用する必要はありません。

gapi.auth2.OfflineAccessOptions

GoogleAuth.grantOfflineAccess(options) メソッドのさまざまな構成パラメータを表すインターフェース。

パラメータ
prompt string 同意フローに特定のモードを強制します。省略可。
値は次のとおりです。
  • consent
    認可サーバーは、ユーザーに同意を求めてから、アプリに情報を返します。
  • select_account
    認可サーバーは、Google アカウントを選択するようユーザーに求めるプロンプトを表示します。これにより、複数のアカウントを持つユーザーは、現在のセッションがある複数のアカウントから選択できます。
scope string gapi.auth2.init パラメータで定義されたスコープに加えて、リクエストするスコープ(スペース区切りの文字列)。fetch_basic_profile が false に設定されていない場合は省略可能です。

GoogleAuth.attachClickHandler(container, options, onsuccess, onfailure)

指定されたコンテナのクリック ハンドラにログインフローをアタッチします。

引数
container クリック ハンドラをアタッチする div 要素の ID または参照。
options パラメータの Key-Value ペアを含むオブジェクト。GoogleAuth.signIn() をご覧ください。
onsuccess ログインが完了した後に呼び出す関数。
onfailure ログインに失敗した場合に呼び出す関数。

ユーザー

GoogleUser オブジェクトは 1 つのユーザー アカウントを表します。通常、GoogleUser オブジェクトは GoogleAuth.currentUser.get() を呼び出して取得します。

GoogleAuth.currentUser.get()

現在のユーザーを表す GoogleUser オブジェクトを返します。新しく初期化された GoogleAuth インスタンスでは、現在のユーザーは設定されていません。currentUser.listen() メソッドまたは GoogleAuth.then() を使用して、初期化された GoogleAuth インスタンスを取得します。

戻り値
GoogleUser 現在のユーザー

GoogleAuth.currentUser.listen(listener)

currentUser の変更をリッスンします。

引数
listener GoogleUser パラメータを受け取る関数。listen は、currentUser を変更するたびに、この関数に GoogleUser インスタンスを渡します。

GoogleUser.getId()

ユーザーの一意の ID 文字列を取得します。

戻り値
文字列 ユーザーの一意の ID

GoogleUser.isSignedIn()

ユーザーがログインしている場合は true を返します。

戻り値
ブール値 ユーザーがログインしている場合は true

GoogleUser.getHostedDomain()

ユーザーが G Suite アカウントでログインしている場合は、ユーザーの G Suite ドメインを取得します。

戻り値
文字列 ユーザーの G Suite ドメイン

GoogleUser.getGrantedScopes()

ユーザーが付与したスコープをスペース区切りの文字列として取得します。

戻り値
文字列 ユーザーによって付与されたスコープ

GoogleUser.getBasicProfile()

ユーザーの基本的なプロフィール情報を取得します。

戻り値
gapi.auth2.BasicProfile gapi.auth2.BasicProfile のプロパティは、次の方法で取得できます。
  • BasicProfile.getId()
  • BasicProfile.getName()
  • BasicProfile.getGivenName()
  • BasicProfile.getFamilyName()
  • BasicProfile.getImageUrl()
  • BasicProfile.getEmail()

GoogleUser.getAuthResponse(includeAuthorizationData)

ユーザーの認証セッションからレスポンス オブジェクトを取得します。

引数
includeAuthorizationData 省略可: アクセス トークンとスコープを常に返すかどうかを指定するブール値。デフォルトでは、fetch_basic_profile が true(デフォルト値)で、追加のスコープをリクエストしていない場合、アクセス トークンとリクエストされたスコープは返されません。
戻り値
gapi.auth2.AuthResponse gapi.auth2.AuthResponse オブジェクト。

GoogleUser.reloadAuthResponse()

アクセス トークンを強制的に更新し、新しい AuthResponse の Promise を返します。

戻り値
Promise OAuth トークンの再読み込みが完了したときに、再読み込みされた gapi.auth2.AuthResponse で満たされる Promise

gapi.auth2.AuthResponse

GoogleUser.getAuthResponse(includeAuthorizationData) メソッドまたは GoogleUser.reloadAuthResponse() メソッドを呼び出したときに返されるレスポンス。

プロパティ
access_token string 付与されたアクセス トークン。
id_token string 付与された ID トークン。
scope string アクセス トークンで付与されたスコープ。
expires_in number アクセス トークンが期限切れになるまでの秒数。
first_issued_at number ユーザーがリクエストされたスコープを最初に付与したタイムスタンプ。
expires_at number アクセス トークンの有効期限が切れるタイムスタンプ。

GoogleUser.hasGrantedScopes(scopes)

ユーザーが指定されたスコープを付与した場合は true を返します。

引数
scopes スペース区切りのスコープの文字列。
戻り値
ブール値 スコープが付与された場合は true

GoogleUser.grant(options)

ユーザーに追加のスコープをリクエストします。

パラメータのリストとエラーコードについては、GoogleAuth.signIn() をご覧ください。

GoogleUser.grantOfflineAccess(options)

指定したスコープにオフラインでアクセスする権限をユーザーから取得します。

引数
options パラメータの Key-Value ペアを含む gapi.auth2.OfflineAccessOptions オブジェクト。例:
{
  scope: 'profile email'
}

GoogleUser.disconnect()

ユーザーがアプリに付与したすべてのスコープを取り消します。

UI 要素

gapi.signin2.render(id, options)

options オブジェクトで指定された設定を使用して、指定された ID の要素にログイン ボタンをレンダリングします。

引数
id ログイン ボタンをレンダリングする要素の ID。
options ボタンのレンダリングに使用する設定を含むオブジェクト。たとえば、次のように指定します。
{
  scope: 'email',
  width: 200,
  height: 50,
  longtitle: true,
  theme: 'dark',
  onsuccess: handleSuccess,
  onfailure: handleFailure
}
次のオプションを指定できます。
パラメータ
スコープ ユーザーのログイン時にリクエストするスコープ(デフォルト: profile)。
ボタンの幅(ピクセル単位)(デフォルト: 120)。
height ボタンの高さ(ピクセル単位)(デフォルト: 36)。
longtitle 「ログイン」ではなく「Google でログイン」などの長いラベルを表示します(デフォルト: false)。長いタイトルを使用する場合は、ボタンの幅をデフォルトから大きくする必要があります。
テーマ ボタンの色テーマ: light または dark(デフォルト: light)。
onsuccess ユーザーが正常にログインしたときに呼び出すコールバック関数。この関数は、gapi.auth2.GoogleUser のインスタンス(デフォルト: なし)という 1 つの引数を受け取る必要があります。
onfailure ログインに失敗したときに呼び出すコールバック関数。この関数は引数を受け取りません(デフォルト: なし)。

高度

gapi.auth2.authorize(params, callback)

1 回限りの OAuth 2.0 認可を行います。使用されるパラメータに応じて、Google ログイン フローのポップアップが開くか、ユーザー操作なしでリクエストされたレスポンスをサイレントで読み込もうとします。

この方法が役立つユースケースには、次のようなものがあります。

  • アプリは、Google API エンドポイントを 1 回だけリクエストする必要があります(ユーザーが初めてログインしたときにユーザーのお気に入りの YouTube 動画を読み込む場合など)。
  • アプリケーションには独自のセッション管理インフラストラクチャがあり、バックエンドでユーザーを識別するために ID トークンが必要なのは 1 回だけです。
  • 同じページ内で複数のクライアント ID が使用されている。
引数
params 構成データの Key-Value ペアを含むオブジェクト。構成可能なプロパティについては、gapi.auth2.AuthorizeConfig をご覧ください。例:
{
  client_id: 'CLIENT_ID.apps.googleusercontent.com',
  scope: 'email profile openid',
  response_type: 'id_token permission'
}
callback リクエストが完了した後(成功または失敗のいずれか)に gapi.auth2.AuthorizeResponse オブジェクトで呼び出される関数。

gapi.auth2.authorize({
  client_id: 'CLIENT_ID.apps.googleusercontent.com',
  scope: 'email profile openid',
  response_type: 'id_token permission'
}, function(response) {
  if (response.error) {
    // An error happened!
    return;
  }
  // The user authorized the application for the scopes requested.
  var accessToken = response.access_token;
  var idToken = response.id_token;
  // You can also now use gapi.client to perform authenticated requests.
});

エラーコード

idpiframe_initialization_failed
サポートされていない環境など、Google から必要な iframe を初期化できませんでした。details プロパティには、発生したエラーの詳細情報が含まれます。
popup_closed_by_user
ログイン フローを完了する前に、ユーザーがポップアップを閉じた。
access_denied
ユーザーが必要なスコープへの権限を拒否しました。
immediate_failed
同意フローを表示せずにユーザーを自動的に選択することはできません。prompt: 'none' オプションで signIn を使用するとエラーが発生します。

gapi.auth2.AuthorizeConfig

gapi.auth2.authorize メソッドのさまざまな構成パラメータを表すインターフェース。

プロパティ
client_id string 必須。Google API コンソールで検索して作成したアプリのクライアント ID。
scope string 必須。リクエストするスコープ(スペース区切りの文字列)。
response_type string レスポンス タイプをスペースで区切ったリスト。デフォルトは 'permission' です。有効な値は次のとおりです。
  • id_token: ID トークンを取得する
  • permission(または token): アクセス トークンを取得します。
  • code: 認証コードを取得する
prompt string 同意フローに特定のモードを強制します。有効な値は次のとおりです。
  • consent
    認可サーバーは、ユーザーに同意を求めてから、情報をアプリに返します。
  • select_account
    認可サーバーは、Google アカウントを選択するようユーザーに求めるプロンプトを表示します。これにより、複数のアカウントを持つユーザーは、現在のセッションがある複数のアカウントから選択できます。
  • none
    認可サーバーは、認証画面やユーザーの同意画面を表示しません。ユーザーがまだ認証されておらず、リクエストされたスコープに同意していない場合は、エラーが返されます。
    レスポンス タイプとして code がリクエストされた場合、返されるコードは refresh_token ではなく access_token にのみ交換できます。
cookie_policy string ログイン Cookie を作成するドメイン。URI、single_host_originnone のいずれか。指定しない場合のデフォルトは single_host_origin です。
hosted_domain string ユーザーがログインするために所属している必要がある G Suite ドメイン。これはクライアントによって変更される可能性があるため、返されたユーザーのホストドメイン プロパティを必ず確認してください。
login_hint string ログイン フローで事前選択するユーザーのメールアドレスまたはユーザー ID。prompt: "none" を使用しない限り、ユーザーによる変更を受けやすくなります。
include_granted_scopes boolean ユーザーがアプリに以前に付与したすべてのスコープを含むアクセス トークンをリクエストするか、現在の呼び出しでリクエストされたスコープのみをリクエストするか。デフォルトは true です。
enable_granular_consent boolean 省略可。きめ細かい権限を有効にするかどうか。false に設定すると、2019 年より前に作成された OAuth クライアント ID に対して、より詳細な Google アカウントの権限が無効になります。2019 年以降に作成された OAuth クライアント ID には影響しません。これらの ID では、よりきめ細かい権限が常に有効になっているためです。
plugin_name string 省略可。設定されている場合、2022 年 7 月 29 日より前に作成されたクライアント ID は Google Platform Library を使用できます。デフォルトでは、新しく作成されたクライアント ID は Platform Library の使用がブロックされ、代わりに新しい Google Identity Services ライブラリを使用する必要があります。任意の値を選択できますが、簡単に識別できるように、プロダクト名やプラグイン名などのわかりやすい名前をおすすめします。例: plugin_name: 'YOUR_STRING_HERE'

gapi.auth2.AuthorizeResponse

gapi.auth2.authorize メソッドのコールバックに返されたレスポンス。

プロパティ
access_token string アクセス トークンが付与されました。response_typepermission または token が指定されている場合にのみ存在します。
id_token string 付与された ID トークン。response_typeid_token が指定されている場合にのみ存在します。
code string 認証コードが付与されます。response_typecode が指定されている場合にのみ存在します。
scope string アクセス トークンで付与されたスコープ。response_typepermission または token が指定されている場合にのみ存在します。
expires_in number アクセス トークンが期限切れになるまでの秒数。response_typepermission または token が指定されている場合にのみ存在します。
first_issued_at number ユーザーがリクエストされたスコープを最初に許可したタイムスタンプ。response_typepermission または token が指定されている場合にのみ存在します。
expires_at number アクセス トークンが期限切れになるタイムスタンプ。response_typepermission または token が指定されている場合にのみ存在します。
error string リクエストが失敗した場合は、エラーコードが含まれます。
error_subtype string リクエストが失敗した場合、返されるエラーコードに加えて追加情報が含まれることがあります。