Amazon Cognito
開発者ガイド

サインアップおよびサインインに Amazon Cognito のホストされた UI を使用する

ユーザープールでアプリを作成して、ユーザーのサインアップやサインインに利用できるビルドインウェブページを使用できます。Amazon Cognito にホストされた UI は、Facebook、Amazon や Google 、または OpenID Connect (OIDC) および SAML ID プロバイダーを介してユーザープールに直接サインインする機能など、その他の性能の基盤となります。

アプリクライアントの追加 (AWS マネジメントコンソール)

  1. Amazon Cognito コンソールに移動します。AWS 認証情報を要求される場合があります。

  2. [Manage your User Pools] を選択します。

  3. リストから既存のユーザープールを選択するか、ユーザープールを作成します。

  4. ページの左側にあるナビゲーションバーで、[全般設定] の [アプリクライアント] を選択します。

  5. [Add an app client] を選択します。

  6. アプリに名前を付けます。

  7. 認証フローで必要な場合を除き、[クライアントシークレットを生成する] オプションはオフにします。クライアントシークレットは、アプリケーションのサーバー側のコンポーネントでクライアントシークレットを保護できる場合に使用します。

  8. [Create app client] を選択します。

  9. [アプリクライアント ID] を書き留めます。

  10. [プールの詳細に戻る] を選択します。

  11. アプリケーションを設定します。

    1. コンソールページの左側にあるナビゲーションバーで、[アプリクライアントの設定] を選択します。

    2. [Cognito ユーザープール] を [有効な ID プロバイダー] の 1 つとして選択します。

      注記

      Facebook、Amazon、Google に加え、OpenID Connect (OIDC) や SAML IdP など、外部の ID プロバイダー (IdP) を使用してサインインするには、まず以下の説明に従ってプロバイダーを設定してから、[アプリクライアントの設定] ページに戻って、プロバイダーを有効にします。

    3. ユーザーが認証された後 Amazon Cognito 承認サーバーが呼び出すコールバック URL を入力します。ウェブアプリについては、URL は、https://www.example.com のように https:// で始まる必要があります。

      iOS または Android アプリの場合は、myapp:// などのコールバック URL を使用できます。

    4. [Authorization code grant (認証コードの付与)] を選択して、ユーザープールトークンと交換される認証コードが返されます。トークンはエンドユーザーに直接公開されないため、侵害される可能性は低くなります。ただし、ユーザープールトークンの認証コードを交換するために、バックエンドでカスタムアプリケーションが必要です。セキュリティ上の理由から、モバイルアプリケーション用の認証コード付与フローとコード交換用証明キー (PKCE) を併用することをお勧めします。

      [許可されている OAuth フロー] で [暗黙的付与] を選択し、Amazon Cognito から、ユーザープール JSON ウェブトークン (JWT) を返します。このフローは、トークンの認証コードを交換できるバックエンドがない場合に使用できます。トークンのデバッグにも役立ちます。

      [Authorization code grant (認証コードの付与)] と [Implicit code grant (暗黙的コードの付与)] の両方を有効にして、必要に応じて各権限を使用することができます。

      具体的に除外する必要がない限り、すべての [許可されている OAuth スコープ] のチェックボックスをオンにします。

      注記

      アプリがユーザーの代わりではなく自身の代わりとしてアクセストークンをリクエストする必要がある場合にのみ、[クライアント認証情報] を選択します。

    5. [Save changes] を選択します。

  12. ドメインを設定します。

    1. [ドメイン名] ページで、利用可能なドメインプレフィックスを入力します。

    2. 完全なドメインアドレスを書き留めます。

    3. [Save changes] を選択します。

サインインページを表示するには

ホストされた UI のサインインウェブページを表示するには、次の URL を使用します。response_type を書き留めます。この場合は、認証コード付与の response_type=code です。

https://<your_domain>/login?response_type=code&client_id=<your_app_client_id>&redirect_uri=<your_callback_url>

response_type=token である暗黙のコード付与の次の URL を使用して、ホストされた UI サインインウェブページを表示できます。サインインに成功すると、Amazon Cognito は、ユーザープールのトークンをウェブブラウザのアドレスバーに返します。

https://<your_domain>/login?response_type=token&client_id=<your_app_client_id>&redirect_uri=<your_callback_url>

JSON ウェブトークン (JWT) ID トークンは、レスポンスの #idtoken= パラメータの後にあります。

ここでは、暗黙的な付与リクエストからのレスポンスの例を示します。ID トークン文字列はもっと長くなります。

https://www.example.com/#id_token=123456789tokens123456789&expires_in=3600&token_type=Bearer

AWS Lambda を使用してユーザープールトークンをデコードし、検証できます。AWS GitHub ウェブサイトの Amazon Cognito JWT トークンのデコードと検証を参照してください。

Amazon Cognito ユーザープールトークンは、RS256 アルゴリズムを使用して署名されます。

コンソールで行った変更が表示される前に、ブラウザを更新するため 1 分待たなければならない場合があります。

ドメインは [ドメイン名] ページに表示されています。アプリクライアント ID およびコールバック URL は [アプリクライアントの設定] ページに表示されています。

注記

Amazon Cognito でホストされたサインインウェブページは、カスタム認証フローをサポートしていません。