AWSを利用した動画変換から動画配信まで #PHP

動画関連の知識がなく苦労したのでメモ。

ffmpegでの動画変換も試したのですが、変換の時間とサーバのリソースを食うため、
小規模サービスでは向かないと判断し、ElasticTranscoderを利用することとしました。

今回の構成としては、COOKPADに近いものとなっています。
http://techlife.cookpad.com/entry/2014/06/17/160905

動画配信方法

PC,スマートフォン(iOS, Android)向けに配信する方法を調査し、最終的にmp4とHLSで配信する事としました。
大半のデバイスはこの2種類を用意すればカバーできます。
mp4 : PC, Android2系への配信(flash)
HLS : iOS, Android4系への配信

HTML5での動画再生用のライブラリがいくつかあるので、
そちらを使えば両形式の配信に対応できます。
今回のサンプルではVideoJSを使います。
http://www.videojs.com/

事前準備

まず、AWSで 【CloudFront】 【S3】 【ElasticTranscoder】 を利用します。
【S3】
bucket、サンプル動画、アウトプット用フォルダを用意します。
bucket：video_sample
動画ファイル：sample.mov
フォルダ：test

【CloudFront】
Distributionは「Web」「RTMP」を用意します。
WebはHLS、RTMPはflashで使用します。

【ElasticTranscoder】
テスト用のPipeline「test-Pipeline」を作成します。
Pipelineとは、InputやOutput用のS3のバケット等を指定するものです。
動画変換は、このPipelineに対してJobを作成すると動画変換されるようになっています。
また、動画変換時に指定するPresetは変換するコンテナ等の定義となっています。
※サムネイルも生成する場合、デフォルトで用意されているPresetでは画像が荒いため、個別に作成することをお勧めします。

SDKを利用した動画変換サンプル

今回利用するPHPとSDKのバージョンは下記の通りです。
・PHP5.5系
・AWD SDK for PHP2.4.5

API reference
http://docs.aws.amazon.com/aws-sdk-php/latest/class-Aws.ElasticTranscoder.ElasticTranscoderClient.html

ElasticTranscoder.php


<?php
use Aws\Common\Aws;
use Aws\Common\Enum\Region;
use Aws\ElasticTranscoder\Exception\ElasticTranscoderException;
use Aws\ElasticTranscoder\ElasticTranscoderClient;

class ElasticTranscoder {

    private $obj = null;

    /**
     * AWS SDK for PHP
     */
    private function getInstance() {
        if (is_null($this->obj)) {
            $this->obj = Aws::factory([
                'key'    => 'xxxxxxxxxx',
                'secret' => 'yyyyyyyyyy',
                'region' => Region::TOKYO
            ])->get('ElasticTranscoder');
        }
        return $this->obj;
    }

    /**
     * createJob
     */
    public function createJob($args) {
        try {
            $res = $this->getInstance()->createJob($args);
        } catch (Exception $e) {
            #echo $e->getMessage();
            return false;
        }
        return $res;
    }
}

$ElasticTranscoder = new ElasticTranscoder();
$ElasticTranscoder->createJob([
    'PipelineId' => 'test-Pipeline',
    'Input' => [
        'Key' => 'sample.mov',
    ],
    'Outputs' => [
        // mp4 & Thumbnail
        [
            'Key'              => 'test/output.mp4',
            'PresetId'         => '1351620000001-100070', // System preset: HLS 2M
            'ThumbnailPattern' => "output-{count}"
        ],
        // HLS
        [
            'Key'             => 'test/output',
            'PresetId'        => '1351620000001-200010', // System preset: HLS 2M
            'SegmentDuration' => 5 // 動画を何秒ごとに分割するか
        ]
    ],
]);

上記の処理を実行してJobが完了すると、アウトプット用フォルダ「test」内に下記のファイルが生成されます。
サムネイルとHLSのファイルに関しては、Presetや動画の再生時間によってファイル数が変わります。
・サムネイル
output-00001.png
output-00002.png
・mp4
output.mp4
・HLS
output.m3u8
output000000.ts
output000001.ts

動画再生用HTMLサンプル

headタグ

<link rel="stylesheet" type="text/css" href="video-js.css" />   
<script type="text/javascript" src="video.js">

bodyタグ

<video id="sample_video" class="video-js vjs-default-skin" width="100%" height="100%" poster="http://{S3のドメイン}/test/output-00001.png" preload="none" controls>
     <source src="http://{CloudFront(Web)のドメイン}/test/output.m3u8" type="application/x-mpegURL" />
    <source src="rtmp://{CloudFront(RTMP)のドメイン}/cfx/st/&mp4:test/output.mp4" type="rtmp/mp4" />
</video>
<script>
videojs.options.flash.swf = "video-js.swf";
var homePlayer=_V_("sample_video");
</script>

最後に

動画ファイルの管理から変換、配信までAWSのサービスだけで完結できるので、AWS凄いなという印象です。
ただ、動画について知識が無い状態でスタートすると、用意する動画の形式や配信方法、ElasticTranscoderの使い方等、
情報が少なく苦戦したので、今後動画関連の機能を実装する方の参考になれば幸いです。