Amazon Cognito Hosted UI のシンプルなセットアップ

Webサービスでユーザーに認証・認可を簡単に行いたいと考えたとき、
自前で認証サービスを構築する方法と、Firebase AuthenticationなどのIDaaSを利用する方法があります。

今回は、IDaaSを利用して簡易的なログインページを用意できる、Amazon Cognito Hosted UIについて紹介します。

はじめに

こんにちは。
クラウドソリューショングループのwatanabe.tです。
Amazon Cognitoは、Webアプリケーションやモバイルアプリケーションに、安全なユーザー認証・認可、ユーザー管理を簡単に追加できるサービスです。
Hosted UI機能を使用することで、開発者が自前で認証フロントエンドを作成する手間を省き、AWSが提供する標準的なログインインターフェイスを利用できます。

そこでこの記事では、Amazon Cognitoユーザープールの設定から、ALBへの認証の追加、初回ログイン時のパスワード変更プロセスまでの実装手順を解説します。

前提条件

以下については本記事で扱いません。別途、公式ドキュメントなどを参考にしてください。

AWSアカウントの準備
OIDCとは何か
ELBやEC2などのWebアプリケーション側の解説
カスタムドメインの取得
カスタムドメインのSSL証明書の取得

Amazon Cognitoユーザープールの設定

まずはAmazon Cognitoにユーザープール（ユーザーを管理するデータベース）の作成から行いましょう。

Amazon Cognitoのコンソールを開き、「ユーザープールを作成」から開始します。
ユーザープールは設定項目が多いですが、シンプルな認証だけできれば良いので以下で設定していきましょう。

カテゴリ	項目名	設定値
認証プロバイダー	プロバイダーのタイプ	Cognitoユーザープール
	Cognitoユーザープールのサインインオプション	ユーザー名
	ユーザー名の要件	選択なし
パスワードポリシー	パスワードポリシーモード	Cognitoデフォルト
多要素認証	MFAの強制	MFAなし
ユーザーアカウントの復旧	セルフサービスのアカウントの復旧を有効化	無効
セルフサービスのサインアップ	自己登録を有効化	無効
属性検証とユーザーアカウントの確認	Cognitoが検証と確認のためにメッセージを自動的に送信することを許可	無効
必須の属性	追加の必須属性	選択なし
Eメール	Eメールプロバイダー	CognitoでEメールを送信
	SESリージョン	ap-northeast-1 (東京)
	送信元のEメールアドレス	no-reply@verificationemail.com
	返信先 E メールアドレス	なし
ユーザープール名	ユーザープール名	任意の名前
ホストされた認証ページ	Cognito のホストされた UI を使用	有効
ドメイン	ドメインタイプ	カスタムドメインを使用
	カスタムドメイン	取得済みのサブドメインなど
	ACM 証明書	ACMで取得済みのもの
最初のアプリケーションクライアント	アプリケーションタイプ	秘密クライアント
	アプリケーションクライアント名	任意の名前
	クライアントシークレット	クライアントのシークレットを生成する
	許可されているコールバック URL	https://[ALBに設定するサブドメイン名]/oauth2/idpresponse

ALBへの設定追加

次に、認証が必要なアクセス先のWebアプリケーションの設定を行います。
今回はALBのリスナールールに認証設定を行うので、ALBの設定を変更していきます。

なお、ALBにCognito認証を設定するには、ALBがHTTPSでリクエストを受け付ける必要があるため、カスタムドメインとSSL証明書を設定しています。

次にリスナーのアクションに認証設定を行います。「OpenID または Amazon Cognito を使用する」のチェックを入れると、認証設定が開きます。
ここでアイデンティティプロバイダーを「Amazon Cognito」を選択すると、認証に使う Cognito の設定を行うことができます。
ユーザープールには先ほど作成したCognitoのユーザープール、ドメインには先ほどCognitoに設定したカスタムドメインを選択します。