はじめに
Cognitoでは、ユーザプールでのログインやFacebook、Googleなどのソーシャルログインに加え、SAMLやOIDCなどの外部のIdPと連携する機能があります。
今回は、その機能を使って、OIDCに準拠する外部のIdPと連携してみたので、その手順とハマったポイントについて記載します。
なんでわざわざCognitoと連携するの？
わざわざCognitoと経由しなくても、直接外部のIdPの認証機能を使って認証すれば良いのでは？と思った方もいるかと思います。が、個人的には以下の2点がメリットと考え、Cognitoと連携することとしました。
- S3などのAWSのサービスと連携しやすい
- Cognitoと連携するようにしておけば、Cognitoの認証情報を使ってS3などへのアクセス権限をコントロールする仕組みを作りやすい
- ソーシャルログインなど他の認証方法を追加しやすい
- 追加時の影響をCognitoが吸収してくれて、バックエンドのアプリケーションへの影響がない
具体的な手順
前提として、AmplifyでCognitoを作成済みの状態とします。
1.外部IdP側でクライアントID・クライアントシークレット・発行者URLを生成する
今回は、こちらは連携先のIdPの管理者に依頼して対応いただきました。
その際、外部IdP側でリダイレクトURLの入力が必要となるので、Cognitoのドメインの末尾に/oauth2/idpresponseをつけたものを入力してもらいます。
これで、Cognitoと連携する際に必要な、クライアントID・クライアントシークレット・発行者URLがもらえるはずです。
ちなみに、発行者URLとは、OIDCの発行者を識別するための、https://ではじまるURLです。
2.Cognitoにプロバイダを追加する
Cognitoのサインインエクスペリエンスのタブにフェデレーテッドアイデンティティプロバイダーのサインインという項目があるので、こちらを追加したいです。
amplifyでCognitoを作っていたので、当然amplifyで追加したいと考えます。
ということで、amplify update auth -> Update OAuth social providersを選択としましたが、GoogleやFacebookなどの有名どころの選択肢はありますが、独自のOIDCのプロバイダは選べません。
以下のissueをみても、まだamplifyで追加できるようにはなっていなさそうです。
ということで、先ほどの画面の「アイデンティティプロバイダを追加」から手動で追加していきます。
以下を入力する箇所があるので、順番に入力していきます。
- プロバイダー名：任意の文字列を入力
- クライアントID：1で取得した情報を入力
- クライアントシークレット：1で取得した情報を入力
- 発行者URL：1で取得した情報を入力
少し悩んだのが以下の「許可されたスコープ」と「OpenID Connect プロバイダーとユーザープールの間で属性をマッピング」の部分です。
ここは、IdPからどういった情報を取得したいか次第なのですが、今回は以下を設定しました。
（IdP側にこれらの属性へのアクセスを許可してもらう必要があります。）
- openid：idトークンを取得するのに必要っぽい
- email：emailとりたかった
- profile：given_name、family_nameをとりたかった
3.Cognitoのアプリケーションクライアントを編集
Cognitoのアプリケーションクライアントの設定で、先ほど設定したIDプロバイダーを選択して追加します。
4.エンドポイントを叩いて検証
一通り設定が完了したので検証していきます。
検証するには、本来はフロントエンドのコードを書いて検証するのが一番ですが、一旦簡易的な方法を記載します。
以下の形で、Cognitoの認証のエンドポイント（ドメインは手順1で紹介したものと同様）に対するGETメソッドを発行して、ブラウザに貼り付けるなどすればOKです。
※ここのクライアントIDは外部IdPのものではなくCognitoのアプリケーションクライアントのクライアントIDなので注意
この時、うまく設定できていれば、外部IdPの認証画面に遷移し、その後、ブラウザのURL入力欄で認可コードを取得できるはずです。
ハマったポイント
（力尽きてきたので、少し雑にメモ）
外部IdPに、PKCEというクライアント認証の仕組みが設定されており、Cognitoとの連携がうまくいきませんでした。
AWSのサポートに問い合わせてみましたが、CognitoはPKCEを使用したIdPとは連携できないとのことだったので、外部IdP側の設定を変えてもらいました。
参考情報
そもそもOAuthとは？を復習するのにすごく参考になりました。
NCDC株式会社( ncdc.co.jp/ )のテックブログです。 主にエンジニアチームのメンバーが投稿します。 募集中のエンジニアのポジションや、採用している技術スタックの紹介などはこちら( github.com/ncdcdev/recruitment )をご覧ください！
Discussion