> ## Documentation Index
> Fetch the complete documentation index at: https://translations.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# アプリケーションに Google ログインを追加する

> Auth0 を使用して、アプリケーションに Google でのログインを追加する方法を説明します。OAuth 2.0 を使用して Google のソーシャル接続を設定し、ユーザーが Google アカウントで認証できるようにします。

Auth0 は Google でのログインをサポートしており、ユーザーは <Tooltip tip="OAuth 2.0: 認可プロトコルとワークフローを定義する認可フレームワーク。" cta="用語集を見る" href="/docs/ja-jp/glossary?term=OAuth+2.0">OAuth 2.0</Tooltip> を通じて Google アカウントで認証できます。Google をソーシャルログインの選択肢として追加すると、多くのユーザーにとって使い慣れた、信頼できるスムーズなログイン体験を提供できます。

Google のソーシャル接続を設定するには、次の作業が必要です。

1. Google Auth Platform で Google OAuth の資格情報を作成する。
2. Auth0 Dashboard で Google のソーシャル接続を設定し、テストする。

<Card title="始める前に">
  Google をソーシャル接続として設定する前に、次のものが必要です。

  1. [Auth0 アカウント](https://auth0.com/signup)。お持ちでない場合は、無料で登録できます。
  2. [Google Developer アカウント](https://console.cloud.google.com/)。
  3. [Google Project](https://developers.google.com/workspace/guides/create-project)。
  4. [Auth0 Dashboard](https://manage.auth0.com/#/applications) に登録済みのアプリケーション。
</Card>

<div id="google-auth-platform">
  ## Google Auth Platform
</div>

Google Auth Platform は [Google Cloud Console](https://console.cloud.google.com/) 内のセクションで、ログインや Google API の呼び出しに使用するアプリケーションと OAuth 資格情報を管理できます。詳しくは、Google のドキュメントにある [Get started with the Google Auth Platform](https://developers.google.com/identity/protocols/oauth2) をご覧ください。

Google Auth Platform では、次のことを行えます。

1. Google の同意画面を設定します。
2. Google OAuth 2.0 クライアントを作成します。

<div id="configure-the-google-consent-screen">
  ### Google の同意画面を設定する
</div>

OAuth クライアント ID を作成する前に、アプリケーションに関する情報を使って OAuth の同意画面を設定する必要があります。認可に OAuth 2.0 を使用すると、アプリケーションは Google アカウントに対して 1 つ以上のアクセス スコープを要求します。Google は、プロジェクトの概要、ポリシー、要求されたアクセス スコープを含む同意画面をユーザーに表示します。

<Callout icon="file-lines" color="#0EA5E9" iconType="regular">
  アプリケーションが機微な OAuth スコープを要求する場合、またはカスタム画像を使用する場合は、[OAuth の同意画面が確認されるまで、ログインは 100 回に制限されます](https://support.google.com/cloud/answer/15549049)。同意画面の確認には数日かかることがあります。
</Callout>

Google Cloud Console で、[Google OAuth の同意画面を設定します](https://support.google.com/cloud/answer/15549049):

<Steps>
  <Step title="Brandingを設定する">
    **Google Auth Platform > Branding** に移動します。**Authorized domains** に `auth0.com` を入力します。カスタムドメインを使用している場合は、代わりにそのカスタムドメインを入力します。
  </Step>

  <Step title="audienceを設定する">
    **Google Auth Platform > Audience** に移動します。**User type** で **Make External** を選択します。**Test Users** には、テストに使用するメールアドレスを追加できます。
  </Step>

  <Step title="データアクセスを設定する">
    **Google Auth Platform > Data Access** に移動して、スコープを追加または削除します。詳しくは、Google のドキュメントにある [OAuth 2.0 Scopes for Google APIs](https://developers.google.com/identity/protocols/oauth2/scopes) を参照してください。
  </Step>

  <Step title="変更を保存する">
    残りの手順に従って、Google OAuth の同意画面の設定を完了します。**Save Changes** を選択します。
  </Step>
</Steps>

<div id="create-a-google-oauth-20-client">
  ### Google OAuth 2.0 クライアントを作成する
</div>

Google OAuth 2.0 クライアントを作成するには、Auth0 ドメインが必要です。Auth0 ドメインは Auth0 Dashboard で確認できます。

ドメインを確認するには、[Auth0 Dashboard > Settings > Custom Domains](https://manage.auth0.com/#/custom_domains) に移動します。

* カスタムドメインを設定していない場合、Auth0 ドメイン名は `YOUR_TENANT_NAME.YOUR_REGIONAL_SUBDOMAIN.auth0.com` です。リダイレクト URI は `https://YOUR_TENANT_NAME.YOUR_REGIONAL_SUBDOMAIN.auth0.com/login/callback` です。
* カスタムドメインを設定している場合は、代わりにそのカスタムドメインを使用します。リダイレクト URI は `https://YOUR_CUSTOM_DOMAIN/login/callback` です。

<Callout icon="file-lines" color="#0EA5E9" iconType="regular">
  2020 年 6 月より前に US テナントを作成した場合、Auth0 ドメイン名にはリージョンのサブドメインが含まれません: `YOUR_TENANT_NAME.auth0.com`。
</Callout>

Google Cloud Console で、新しい OAuth 2.0 クライアントを作成します。

<Steps>
  <Step title="新しいクライアントを作成する">
    **Google Auth Platform > Clients** に移動し、**New Client** を選択します。
  </Step>

  <Step title="アプリケーションの種類を選択する">
    **Application type** で、**Web application** を選択します。
  </Step>

  <Step title="クライアントの詳細を入力する">
    OAuth 2.0 クライアントに次の情報を入力します。

    | **項目**                            | **値**                                |
    | --------------------------------- | ------------------------------------ |
    | **Name**                          | OAuth 2.0 クライアントの名前                  |
    | **Authorized JavaScript origins** | `https://YOUR_DOMAIN`                |
    | **Authorized redirect URIs**      | `https://YOUR_DOMAIN/login/callback` |

    `YOUR_DOMAIN` は、前の手順で確認した Auth0 ドメインに置き換えてください。
  </Step>

  <Step title="クライアントを作成する">
    **Create** を選択し、Google に表示される **Client ID** と **Client Secret** をコピーします。
  </Step>
</Steps>

<div id="configure-auth0">
  ## Auth0を設定する
</div>

Auth0 Dashboard を使用して、作成した OAuth 資格情報で Google のソーシャル接続を作成し、設定します。

<Steps>
  <Step title="Google のソーシャル接続を作成する">
    [Auth0 Dashboard > Authentication > Social](https://manage.auth0.com/#/social) に移動し、**Create Connection** を選択してから **Google/Gmail** を選択します。
  </Step>

  <Step title="名前と Google の資格情報を入力する">
    **General** で、接続の **Name** と、作成した Google OAuth 2.0 クライアント のクライアント資格情報を入力します。

    * **Client ID**: アプリケーションの一意の識別子です。
    * **Client Secret**: Auth0 がアプリケーションに代わって Google に対して認証を行うために使用するシークレットです。
  </Step>

  <Step title="権限を選択して保存する">
    接続で有効にする権限を選択します。ほとんどのアプリケーションでは、ユーザーのメールアドレスと確認済みメールフラグには **Basic Profile** が、名前、写真、その他のプロファイルの詳細には **Extended Profile** が必要です。

    **Save Changes** を選択します。
  </Step>
</Steps>

<Callout icon="file-lines" color="#0EA5E9" iconType="regular">
  Universal Login を使用している場合、Google One Tap を有効にすると、ユーザーはアクティブな Google セッションを使用してワンタップでサインインできます。詳細については、[Universal Login で Google One Tap を使用する](/docs/ja-jp/authenticate/identity-providers/social-identity-providers/google-one-tap)を参照してください。
</Callout>

<div id="test-the-connection">
  ## 接続をテストする
</div>

Google のソーシャル接続を作成したら、本番環境にデプロイする前に、正しく動作することを確認します。

1. [Auth0 Dashboard > Authentication > Social](https://manage.auth0.com/#/social) に移動します。
2. 一覧から Google 接続を選択します。
3. **Try Connection** を選択します。
4. 画面の指示が表示されたら、Google アカウントで認証します。
5. Auth0 が、ユーザーの名前やメールアドレスを含むユーザープロファイルデータを返すことを確認します。

<div id="learn-more">
  ## 詳しく見る
</div>

* [Universal Login で Google One Tap を使用する](/docs/ja-jp/authenticate/identity-providers/social-identity-providers/google-one-tap)
* [ネイティブ Android アプリに Google サインインを追加する](/docs/ja-jp/authenticate/identity-providers/social-identity-providers/google-native)
* [Auth0 開発者キーを使用してソーシャル接続をテストする](/docs/ja-jp/authenticate/identity-providers/social-identity-providers/devkeys)
* [カスタムソーシャル接続を作成する](/docs/ja-jp/authenticate/identity-providers/social-identity-providers/oauth2)
