こんにちは、矢野(喬)です。
MediaServicesの勉強も兼ねて、Amazon Cognito(以降Cognito)で簡易ユーザー認証を掛けること、Amazon CloudFront(以降CloudFront)で署名付きCookie制限で視聴することを目的として環境を作ってみました。
『兎に角試せ』の精神は大事ですね、知った気でいるものばかりだなあと反省しつつ楽しみながら取り組めましたし、学びも多かったです。
一先ず作れたらいいを優先したので、非推奨のやり方で無理矢理通している部分がありますが、それは次の自分に期待と割り切ってやっていきます。
実際にこの環境で快適に視聴できるかどうかを社内で1時間ライブ配信をして確かめています(ここに大きなモチベーション)。
AWS公式ユーザーガイドを読みながら、ALB→Cognito→CloudFront→S3の流れで繋がるように設定していきます。
適宜簡素にまとめながら進めますが長くなってしまうので、前後編に分けることにしました。
https://docs.aws.amazon.com/ja_jp/cognito/latest/developerguide/cognito-user-identity-pools.html
https://docs.aws.amazon.com/ja_jp/elasticloadbalancing/latest/application/listener-authenticate-users.html
後編はこちらです。
https://blog.serverworks.co.jp/livestreaming-cookie-cognito-2
構成図
視聴者(リスナー)になってくださる方にはALBに繋がるFQDNを伝えて繋いでもらいました
この記事では詳しく触れませんが、Route53で利用できるドメインから、ALB用とCloudFront用にFQDNを用意し利用します
(例えば ALB用.EXAMPLE.JPと CloudFront用.EXAMPLE.JPのように)
視聴者
① 視聴者が ALBのURL にアクセス
② ALB→リスナールールでCognitoに飛ばされ、登録されたユーザーで認証
③ 認証OKの場合、次のリスナールール「固定レスポンス」でhtmlを返却
④ html内でcookieを付与した後にCloudFrontへリダイレクト
⑤ CloudFrontのオリジンのS3にあるビデオプレーヤーを埋め込んだhtmlでライブ配信を再生
配信者
① OBSでライブ配信ボタン押下
② IVSがOBSからデータ取得してライブ配信開始
③ IVSのストリームURLをS3のhtmlに記載
④ S3のIVS用ビデオプレーヤーを再生するhtmlで映像視聴できることを確認
環境構築の流れ
1．Cognitoユーザープール設定
2．CloudFront用のキーペア作成・登録
3．CloudFrontディストリビューション設定
4．署名付きCookie準備
5．ALB設定
6．IVS設定
7．動作確認
前編では 1．Cognitoユーザープール設定 をまとめます
環境構築詳細
1．Cognitoユーザープール設定
「Cognito」から「ユーザープールの作成」をクリック
今回は予め作成したユーザーでログインしてもらいたいので、「ユーザー名」と「ユーザーが任意のユーザー名でサインインすることを許可」にチェックを入れて「次へ」
パスワードのポリシーは適宜設定してください。私は社内に見せる用なのでゆるい設定で
多要素認証やユーザー復旧も必要に応じて。今回はどちらも無しで「次へ」
配信者自身でユーザーを作成し情報を伝えるので自己登録は無し、
検証と確認は「Cognito が検証と確認のためにメッセージを自動的に送信することを許可」と「E メールのメッセージを送信、E メールアドレスを検証」にチェックを入れました
必須の属性はなんでも良いのですがどんなものか見たかったので「given_name」(ユーザーの名前)と「nickname」(ユーザーのカジュアル名、given_nameと同じじゃなくてもOK)にチェックを入れました
カスタム属性は無しで「次へ」
Eメールは「CognitoでEメールを送信」で「次へ」
ユーザープールを任意に設定、「Cognito のホストされた UI を使用」にチェックを入れました
ドメインはCognitoのものを利用し、使えるかの判定が通れば(使用可能になれば)OK
「秘密のクライアント」を選択し、名前は任意、「クライアントのシークレットを生成する」にチェックを入れて
「コールバックURL」には ↓ ページ紹介に従って、前述のALB用のFQDN + /oauth2/idpresponse の形で記載します
https://docs.aws.amazon.com/ja_jp/elasticloadbalancing/latest/application/listener-authenticate-users.html#cognito-requirements
認証フローでは、「ALLOW_USER_PASSWORD_AUTH」「ALOW_USER_SRP_AUTH]にチェックを入れます
更新トークンは1日、180分、180分としました
高度なセキュリティはどちらもチェックを入れます
IDプロバイダーは「Cognito ユーザープール」
権限タイプは「認証コード付与」
OpenID 接続スコープには「OpenID」のみを選択して「次へ」
これで設定は終わり。内容を確認してから「ユーザープールを作成」でOKです
設定項目はそれなりに多いのですが、どの項目にも分かりやすい説明が添えられていて、まるでわからん…で進んでしまう事は無かったのがありがたかったです
これでユーザープールは作成できましたが、まだログインのためのユーザーが有りません
作成されたユーザープールを開いてユーザータブへ移動し「ユーザーを作成」をクリック
今回はメールで知らせる必要は無いので「招待を送信しない」にして「ユーザー名」を設定、「パスワード」を先程決めたポリシーを守りながら設定し「ユーザーを作成」です
これでユーザーが一つ作成できました
ユーザーが実際にログインできるかを確認していきます。アプリケーションの統合 タブに移動して作成したアプリクライアントをクリック
Cognito側で用意してくれた、ホストされたUIから「ホストされたUIを表示」をクリック
ログイン画面が表示されるので、先程作ったユーザーでログインし、パスワードやニックネームなど設定しましょう
ログインができた後にユーザータブに戻ってみると、確認ステータスが『確認済み』に変わってくれています
ボリュームが多かったですが、一先ずこれでCognito準備はOKです
～後編へ続く～
https://blog.serverworks.co.jp/livestreaming-cookie-cognito-2
前編のおわりに
Cognitoは初めて私がまともに触るサービスだったので簡潔にしようとしても長くなってしまいますね。
触る箇所も多く、まだまだ言われるがままに設定を進める程度ではありますが、自分で一つ一つ項目を見ながらふむふむと進められるのは良いですね。
認証のサービスをビギナーでもこうして用意できる所にAWSの懐の深さを感じます。
ということで後編もよろしくお願いします。
ありがとうございました。
