メインコンテンツへスキップ
見出し画像

JAWS DAYS 2022 - Satellites の配信アーキテクチャ

    こんにちは!
    JAWS DAYS 2022 実行委員として、配信基盤の構築を担当している、松井 ( @hide04241990 ) です!
    今回に至るまで、

    • JAWS DAYS 2021 - re:Connect

    • JAWS PANKRATION 2021 -Up till Down-

    にて実行委員として参画し、配信基盤の構築は今回で3回目になります。
    このエントリでは、今までのオンライン配信イベントと比較しながら、以前より進歩したこと、今回工夫したことなどをご紹介します。

    アーキテクチャ

    画像

    今回の配信アーキテクチャは上記の通りとなっております。
    全体としては今までの配信イベントを踏襲しつつ、下記のような点を工夫しました。

    • 今後のオンライン配信イベントででの再利用を見据えた、 可能な限りの IaC 化

    • Google Spread Sheets をデータソースとした Sheets API の制約のワークアラウンド

    • StreamYard でも可能 な、 リアルタイム視聴者数の映像への組み込み

    これらについて解説していきます👍

    可能な限りの IaC 化

    JAWS DAYS 2021 を振り返ると、後付けで色々な機能を加えていった結果、ほとんどコード管理されていない数多くのリソースが乱立してしまいました😅

    多分これで最終だけど #jawsdays2021 配信サイトはこんなアーキテクチャになってる#amazon #ivs の Timed Metadata を使って動画のストリーミングデータのついでにその他諸々のデータをクライアント側に能動的に送ることでほとんどポーリングを無くしました👍 #jawsug #aws pic.twitter.com/EW2lYTaQhP

    — 松井 英俊|スタテク テックリード|AWS Serverless Hero (@hide04241990) March 7, 2021

    それでも、約4000人の参加者の皆さんに、低遅延かつダウンタイムのない快適な動画配信をお届けすることができ、大変良かったと思います!

    その反省を活かし、 JAWS PANKRATION 2021 では、配信視聴者数をリアルタイムに取得・保存し、フロントエンドに反映する部分のソースコードを Serverless Framework を使ってテンプレート化しました。
    また、それを後に AWS CDK に落とし込んだものも開発し、 builders.flash にて記事として公開していただきました🎉
    今回、その PANKRATION の時のテンプレートを、ほとんどそのまま手を入れずに流用できたので、まさに意図した通り、開発の効率化に大きく役立てることができました🎉

    また、今回は後述する Google Spread Sheets を使った配信関連情報の管理のための機構も CDK に落とし込むことができ、次回以降にも役立てることができそうです💪

    Google Spread Sheets の Sheets API の制約のワークアラウンド

    JAWS DAYS 2021 では、配信関連情報(登壇タイトル、内容、登壇者情報等)を更新し、リアルタイムに視聴者に届けるため、またアンケート機能のトリガーを操作するために簡易的な管理ページを AWS Amplify を活用して開発しました。
    これはこれで良かったのですが、準備期間に限りのあった JAWS PANKRATION では、再度この構成を採用するとなると、期間的にリスクが高いという状況でした。
    そのため、 Google Spread Sheets をデータとソースとして、それを別のオペレーション用ページに Sheets API 経由で表示し、ストリーミングされる動画のデータの一部に含めることで表示を実現しました!
    しかし今回はマルチトラック配信であるため、その各種情報を配信サイトの一覧ページにも表示する必要があり、多くの参加者の皆さんがアクセスされた際に、 Sheets API の呼び出し回数制限の5000回/1日に容易に達してしまいそうだということが判明しました😱

    その対策として、 Amazon EventBridge で Lambda 関数を毎分呼び出し、 Sheets API を呼び出し、結果を Amazon S3 に JSON として保存し、 Amazon CloudFront で静的ファイルとして配信する方法を考案しました!
    これにより、 Sheets API の呼び出し回数制限を気にすることなく、リアルタイムに近い情報を配信サイトに反映することができる様になりました🎉

    リアルタイム視聴者数の映像への組み込み

    JAWS PANKRATION では、より良い視聴体験を参加者の皆さんに提供しつつ、開発・運用コストを下げるために、実行委員メンバーで頭を捻りました🧠
    特にボトルネックになってくるのは、配信視聴者数や登壇者情報などのデータをいかにしてリアルタイムに視聴者に届けるか、というポイントでした。
    JAWS DAYS 2021 では、こういったリアルタイムデータを配信視聴サイトの Web ページ内の要素として表示していましたが、これだと視聴者が全画面表示しているときに表示が見えなくなってしまいます。
    その対策として、前述の配信オペレーション用ページに視聴者数を表示し、それを OBS Studio でスライドや登壇者の動画と合成し、ストリーミングされる動画データに含めて表示することで、この問題を回避しました!

    JAWS DAYS 2021 の反省を活かし、より最適化した JAWS PANKRATION 2021 の配信アーキテクチャです!
    /
    The delivery architecture of JAWS PANKRATION 2021 that is more optimized by taking advantage of the reflection of JAWS DAYS 2021!#jawspankration2021 #jawspankration #jawsug #aws pic.twitter.com/Ti7W9WWKkO

    — JAWS-UG (@jawsdays) November 19, 2021

    今回もこの方法は踏襲したかったのですが、 JAWS PANKRATION の時と違い、動画配信ツールとして OBS だけでなく StreamYard も併用することになり、同じ方法を取ることが難しくなってしまいました...

    しかし、これで諦める JAWS DAYS 2022 実行委員会ではありません!
    配信チームでさらに頭を捻り、 OBS Studio の仮想カメラを使って、必要な情報を切り抜いた画面を「画面共有として」 StreamYard で表示することで、見事この問題も解決しました🎉

    まとめ

    いかがでしたでしょうか?
    イベント当日、オンラインで視聴される際にはこの配信基盤をご利用いただきますので、ぜひ楽しみにしていてください!

     
     
    JAWS DAYSはJAWS-UG最大のイベントです。全国のJAWS-UGメンバーが中心となってボランティアベースでイベントの企画、準備を行い、最新技術からビジネス、ライフスタイルなどAWSに関わる幅広いテーマの様々なセッションを開催します。

    あなたへのおすすめ