ここまでの振り返り
本連載も第4回目となりました。第1回ぶりの登場です。お久しぶりです、合同会社DMM.comの矢野(@yanoshi)です。
ここまでの連載で動画のファイル形式や圧縮方法等について解説してきました。第3回の終盤では、簡易的なHTTPサーバーを構築し、動画配信を実現しています。
前回の記事ではツールを利用した再生を行っていたので、ピンとは来ない人もいるかも知れませんが、実はWebブラウザから動画を再生させることがすでに可能となっています。ここからはWebブラウザからのストリーミング再生をしてみましょう。
Webブラウザで動画をストリーミング再生してみる
おさらい
前回の記事にて下記コマンドでHTTPサーバーの立ち上げを行いました。
$ python3 -m http.server 8000
そして下記コマンドを用いてffplayを利用し、動画再生を行いました。
$ ffplay http://localhost:8000/chapter3_faststart.mp4
この動画ストリームを今度はWebブラウザで再生してみましょう。
簡易的なHTMLファイルを用意する
下記のようなHTMLファイル(index.html)を用意し、chapter3_faststart.mp4 と同じディレクトリに設置します。
<!DOCTYPE html> <html> <head> <title>Test streaming player</title> </head> <body> <video src="chapter3_faststart.mp4" controls></video> </body> </html>
「http.server」はRangeリクエストに対応していないため、このままだとシーク操作(動画の特定の位置にジャンプすること)ができません。そのためRangeリクエストに対応しているサードパーティPythonモジュールをインストールして利用します。今回は「RangeHTTPServer」を利用することにしました。
下記のようにインストールします(環境によってはsudoが必要な事があります)。
$ pip3 install rangehttpserver
下記のように起動します。
$ python3 -m RangeHTTPServer
ブラウザで開いて再生してみる
下記URLにアクセスしてみましょう。
どうでしょうか? 再生されましたね。
