ALB + EC2の構成に、Amazon CognitoのHosted UIを利用し、多要素認証(MFA)を実装してみた

2023.05.09

はじめに

ALB + EC2の構成に、CognitoのHosted UIで認証する構築方法を紹介するサイトは、いくつかありましたが、CognitoのマネジメントコンソールのUIが変わっていたため、2023年度版としてブログにします。

構成図は以下の通りです

Cognitoについては、下記の記事を参考ください

前提条件

  • ALB + EC2の構成、かつ、HTTPS化を構築済み
    • Cognitoのユーザー認証は、HTTPSリスナーでのみサポートされているため、HTTPS化は必須です
    • できていない場合、下記を参照してください

サインインに関する要件

今回設定する要件の内容を紹介します。

  • サインインに使用する属性は、以下の2つです
    • ユーザー名
    • メールアドレス
  • MFAは必須
    • Google Authenticatorを使用する
  • ユーザーが登録したメールアドレスを検証のするために送信するEメールアドレス
    • Cognitoのデフォルトメールアドレスno-reply@verificationemail.comを利用
    • 毎日最大40通までしか送信はできませんが、今回は問題ありません
  • サインアップ、サインインのドメイン
    • Cognito で用意されているドメインを使用する

ユーザープールを作成

ユーザープールを作成するため、Cogintoのユーザープールを作成に遷移します。

認証プロバイダー

プロバイダー設定は、要件通り以下のようにしました。

  • Cognito ユーザープールのサインインオプション
    • ユーザー名
    • Eメール
  • ユーザー名の要件
    • ユーザー名の大文字と小文字を区別する

コンソール画面でも記載がありますが、ユーザープール作成後に Cognito ユーザープールのサインインオプションを変更はできませんので、注意してください

セキュリティ要件を設定

  • パスワードポリシーモード
    • Cognito のデフォルト
  • 多要素認証
    • MFA を必須にする
      • Authenticator アプリケーション
  • ユーザーアカウントの復旧
    • セルフサービスのアカウントの復旧を有効化
    • ユーザーアカウントの復旧メッセージの配信方法
      • Eメールのみ

セキュリティ要件は、ユーザープール作成後にも修正可能です。

サインアップエクスペリエンスを設定

  • セルフサービスのサインアップ
    • 自己登録を有効化
      • ユーザー自身がサインアップできるようになります。ホストされた UI のサインインページに [Sign up] リンクが追加されます
  • 属性検証とユーザーアカウントの確認
    • Cognito が検証と確認のためにメッセージを自動的に送信することを許可
    • 検証する属性
      • E メールのメッセージを送信、E メールアドレスを検証
    • 属性変更の確認
      • 未完了の更新があるときに元の属性値をアクティブに保つ
      • Eメール
        • ユーザーが E メールアドレスまたは電話番号属性を更新すると、Cognito は新しい値を検証するまでその属性を unverified とマークします。そのため、検証済みになるまでの間は、検証前の属性値をアクティブに保つ必要があります。

ユーザープール作成後に、必須の属性のみ、変更できません

メッセージ配信を設定

  • Cognito で E メールを送信
    • Cognitoのデフォルトメールアドレスno-reply@verificationemail.comを利用

アプリケーションを統合

  • ユーザープール名
    • 適当な名前
  • ホストされた認証ページ
    • Cognito ホストUIを使用
  • ドメイン
    • Cognito ドメインを使用する
      • https://適当な値を入力
  • 最初のアプリケーションクライアント
    • パブリッククライアント
    • アプリケーションクライアント名
      • 適当な名前
    • クライアントのシークレット
      • クライアントのシークレットを生成する
    • 許可されているコールバック URL (認証後にユーザーをリダイレクトするコールバック)
      • https://[ドメイン名]/oauth2/idpresponse

上記を入力後、ユーザープールを作成しましょう。

作成後に必要な情報

ユーザープール作成後、ユーザープールIDとクライアントIDをコピーしておきます。

ALBのリスナールールに認証の設定

ALBのHTTPS:443のリスナールールに認証の設定を加えます。

  • 認証
    • Amazon Cognito
  • Cognito ユーザープール
    • 先程コピーしておいたユーザープールID
  • アプリクライアント
    • 先程コピーしておいたクライアントID
  • 転送先は、EC2のターゲットグループとします。

サインアップしてみる

  1. Webサイトにアクセスすると、設定した通りのドメインのサインアップ画面にリダイレクトされています。
    • [Sign up]をクリックします。
  2. 適当なユーザー名とメールアドレス、パスワードを入力し、[Sign up]をクリックします。
  3. 入力したメールアドレスに6桁の認証コードが、設定したno-reply@verificationemail.com送られてきました。
  4. 認証コードを入力します。
  5. MFAを設定し、[Sign in]をクリックすると、ユーザー登録が完了です
  6. Webサイトが表示されました!
  7. また、ユーザープールでユーザーが1つ増えていることも確認できました

ちなみに、Cognitoのコンソールからユーザーを新規登録も可能です。

最後に

CognitoのHosted UIを利用すると、簡単に多要素認証(MFA)を実装することができると分かりました。

今回設定しなかったHosted UIのログイン画面の修正やSMSでのMFAもできるため、色々と設定してみようと思います。

参考