Alibaba Cloudで動画配信(VoD)を試してみた

# 概要
Alibaba CloudのMedia Processing Serviceで動画形式を変換し、OSSとECSを利用して簡単な動画配信(VoD)を行います。

# 事前準備
今回はVoDのため、事前に以下の準備を行います。
**1.動画の準備**
　利用した動画は[Big Buck BUNNY](https://peach.blender.org/download/)です。
　MP4形式の動画を利用しました。

**2.OSSの準備**
　1で準備した動画をOSS(Object Storage Service)にアップロードするためのバケットを作成します。
　今回は東京リージョンで作成しました。
　Media Service Processingのリージョンと同一リージョンにした方がスムーズです。

**3.OSSに動画をアップロード**
　2で作成したバケットに動画をアップロードします。
　ファイルページの「アップロード」ボタンをクリックするとアップロード画面が表示されます。
<img width="908" alt="OSS2.PNG" src="https://qiita-image-store.s3.amazonaws.com/0/254932/2f29d3f1-991d-54ae-340d-f228c10fe8a1.png">


　アップロード中
<img width="485" alt="アップロード中" src="https://qiita-image-store.s3.amazonaws.com/0/254932/a8782158-0849-e51b-5dab-b36b29649b7a.png">

　アップロード後
　アップロードが完了したら一覧に表示されます。
<img width="656" alt="アップロード後" src="https://qiita-image-store.s3.amazonaws.com/0/254932/43e0fe06-6404-6a24-4682-6a0973928da9.png">

# Media Processing Service(MPS)の有効化
MPSを利用する際に、OSSとMNSのアクセス権の有効化を聞かれる場合があります。
有効化する必要があるので、画面に沿って進めてください。
<img width="742" alt="アクセス権" src="https://qiita-image-store.s3.amazonaws.com/0/254932/4477f85c-6b91-20ce-ea64-1ee8e50d21c8.png">

画面に沿って進めると、こちらの画面にたどり着きます。
<img width="852" alt="有効化" src="https://qiita-image-store.s3.amazonaws.com/0/254932/be7e3e3a-e84d-7902-c97e-b8ad307b7f82.png">
今回は正式なサービスとしての動画配信環境構築ではないので、オプションにあるMessageServiceやCDN、KeyManagementServiceは利用しません。

# MPSのトランスコードタスク作成
ここからはOSSにアップロードした動画ファイルを変換する作業を行います。
タスク作成ボタンをクリックして、設定を開始します。
<img width="1045" alt="トランスコードタスク" src="https://qiita-image-store.s3.amazonaws.com/0/254932/a1fe9ab4-5c95-59d9-6164-6bf6a9337cdf.png">
2018/08/19時点ですが、タスク作成時に左上に表示されているリージョンと実際にタスクを作成するリージョンが異なっている場合があります。
リージョンが異なっているとOSSのバケットが選択できないという状況になります。
MPSの画面で一度別リージョンにしてから、再度リージョンを元に戻してください。


### タスクの作成画面
<img width="455" alt="タスク作成" src="https://qiita-image-store.s3.amazonaws.com/0/254932/18f7c674-b445-09f8-5089-960ddeb8f879.png">
**入力:**参照ボタンを押して次の画面で動画を指定します。
<img width="457" alt="9.PNG" src="https://qiita-image-store.s3.amazonaws.com/0/254932/5651611c-7116-d548-28c5-435c0f5ef187.png">

**MPSキューのトランスコード:**デフォルト設定のまま
**出力名：**名称を入力
**出力場所：**入力を設定したら自動で設定されます。フォルダなどを指定したい場合は参照ボタンをクリックして設定してください。

### テンプレート設定
変換する内容を指定して**トランスコード**ボタンをクリックします。
<img width="454" alt="テンプレート設定" src="https://qiita-image-store.s3.amazonaws.com/0/254932/a4283dac-ab13-8d15-5da9-2f0e8d55b71a.png">

# トランスコード完了後
トランスコードが完了すると出力場所にしていしたOSSにトランスコードされたファイルが出力されます。
<img width="630" alt="トランスコード完了後" src="https://qiita-image-store.s3.amazonaws.com/0/254932/636547b5-a835-f529-9ccf-4cbb0e607195.png">


それぞれの設定状況を見る、以下の画像の赤枠部分が変わっていることが確認できます。
**変換前**
<img width="372" alt="変換前" src="https://qiita-image-store.s3.amazonaws.com/0/254932/1d2ebdfc-16c8-c7a1-9549-cab2f4a9f70b.png">

**変換後**
<img width="373" alt="変換後" src="https://qiita-image-store.s3.amazonaws.com/0/254932/5304869e-60d4-8cc9-1661-5e3acbe45608.png">

# Webページで動画を表示させる
動画配信方法として今回は、Webページに動画を表示させます。
今回は大規模な動画配信システムではないのでCDNは利用していません。
そのため、OSS側でファイルのACLを公開読み取りに変更してください。(今回特別に設定しています。通常は非推奨です)
ECSでWebサーバーを構築します。
今回はUbuntuでApacheを入れ、sample.htmlというページを作成しました。
HTMLの内容はこの様な感じです。

```
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<h1>Sample Movie</h1>
<video controls width="320">
  <source src="https://Bucketドメイン名/動画ファイル名" type="video/mp4" type="video/mp4">
</video>
</body>
</html>
```

ブラウザでページを確認すると、この様に表示され動画を再生することが出来ました。
<img width="470" alt="画面" src="https://qiita-image-store.s3.amazonaws.com/0/254932/bef1ed2d-e763-675c-95f1-d3674cdb98d8.png">

# まとめ
今回はVoDの動画配信を実際に試してみました。
タスク作成部分でちょっとひっかかった部分がありましたが、動画の変換と配信が比較的簡単に出来ました。
動画のサイズが小さかったため、変換も数分程度で出来ました。
実際に動画配信サービスを行う時は、CDNを入れる必要があり、OSSのACL設定にも気を付ける必要があります。
ただし、CDNは使用に関する制限や審査があるため注意が必要です。
https://jp.alibabacloud.com/help/doc-detail/27114.htm
シンプルな構成なので慣れると使いやすいと思いますが、機能的にはまだ少ないと思うのでこれからに期待したいです。