Skip to content

アップロード機能の大枠を掴むための技術について

TIP

アップロード機能の大枠を掴むための技術の整理

概要

アップロード機能は、Quden上にmp4ファイル(※1)をアップロードすることができる機能。

※1 対応する拡張子は現状mp4だが、将来的に増やしていけたらベター

具体的な処理はコードの方を追ってみてほしいが、大枠は掴みにくいと思うので、大枠を掴むことに焦点を当てて、ドキュメントを書く。

処理フロー

  • FrontEnd
    • アップロードする動画を選択
    • アップロードボタンを押下
  • Backend
    • items/uploads/init
      • itemレコードの初期化
      • presignedUrlの発行
  • FrontEnd
    • presignedUrlを発火し、動画(mp4)をS3バケットへ保存
  • Backend
    • items/uploads/complete
      • itemレコードの更新
        • S3バケットに存在するファイル名の固定値を指定している(いけてない)
      • AWS media converterを実行するため、lambdaを発火
        • S3バケットに存在するmp4ファイルから、プレイリストファイルとセグメントファイルを生成
  • FrontEnd
    • itemレコードのobjectUrlカラムに格納されているURLをshaka playerに渡して、ストリーミング再生を実現している

大枠を掴むために必要な知識

Presigned Url

セキュリティの観点から、ストレージは非公開をデフォルトにしておくべき。

Qudenでも S3 は非公開になってはいるが、非公開の S3 に対して、ファイルをアップロードしたいという課題が生じたときの解決策が Presigned Url。

ざっくり言うと、「署名付きURLを知っている場合は期限付きでS3バケットにアクセスすることができる」。

※読み込みはcloudFront経由で行なっている

動画ストリーミング

とりあえず覚えておいた方がいいのは「プレイリストファイル」と「セグメントファイル」で、動画ストリーミングを実現するためには、上記ファイルが必要になる。

動画アップロードで使用しているストリーミングプロトコルは HLS。

フロントで上記ファイルを再生するための決まりもあるが、Qudenの場合はshaka playerがその辺をうまく回収している。

AWS Media Convert

mp4ファイルから、「プレイリストファイル」と「セグメントファイル」を作成する。

Qudenの場合、上記lambda処理の過程で、S3に置いてあるmp4ファイルから、「プレイリストファイル」と「セグメントファイル」を作成し、プレイリストファイルをフロントに返却している。