OBSとFlazrDumperを使った配信は非常にお手軽だけどFlashが動かない環境(iOSやAndroid)では見れない。そこでVLCメディアプレイヤー(以下VLC)を使ってFLVからHLSをつくり出そうというおはなし。
FlazrDumperはFlash配信のものをそのまま利用。また、FlashPlayerにHLSへの自動転送ページを追加したのでこちらも要更新。
VLCが正しく動いているならば、liveフォルダにmystream.m3u8が作成され、live\tsフォルダではmystream-xxxxxxxxxx.ts(xxxは数字)が作成&削除され続ける。HLS配信を終了する場合はVLC(黒ウィンドウのほう)を閉じる。
HTTP Live Streaming(HLS)はAppleが開発したHTTPを使ったライブ配信の仕組み。HTTPを使っているためHTML5対応Webブラウザでそのまま視聴可能で、iPadやiPhoneだけでなくAndroid 4.x端末でもアプリを導入することなく視聴できる。
まずOBSとFlazrDumperを使ったHTTP Flash配信が行えていることが前提条件。
→ FlazrDumper → VLC → FlazrDumper → 視聴者のWebブラウザ
VLCはFlazrDumperからFLVを受け取りながらHLS用のファイル出力を行い、FlazrDumperのHTTPサーバーが視聴者への送出を請け負うといった流れ。
VLCはFlazrDumperからFLVを受け取りながらHLS用のファイル出力を行い、FlazrDumperのHTTPサーバーが視聴者への送出を請け負うといった流れ。
- トランスコーダー:VLCメディアプレイヤー
- 補助スクリプト(HlsLauncher.js):HlsLauncher
FlazrDumperはFlash配信のものをそのまま利用。また、FlashPlayerにHLSへの自動転送ページを追加したのでこちらも要更新。
- FlazrDumper.jarを実行してFlazrDumperを起動する。
- OBSで配信開始する。
- HlsLauncher.jsを実行してVLCを起動する(コマンドプロンプトのような黒いウィンドウが表示される)。
- VLCをスタートメニューから起動して次のいずれかの方法でm3u8ファイルを開く。
- http://127.0.0.1:8888/live/index_m.htmlをWebブラウザで表示し、下部にあるリンクをVLCへドラッグ・アンド・ドロップ。
- 「ネットワークストリームを開く」からhttp://127.0.0.1:8888/live/mystream.m3u8を開く
VLCが正しく動いているならば、liveフォルダにmystream.m3u8が作成され、live\tsフォルダではmystream-xxxxxxxxxx.ts(xxxは数字)が作成&削除され続ける。HLS配信を終了する場合はVLC(黒ウィンドウのほう)を閉じる。
Flash配信と同じアドレス http://あなたのグローバルIP:8888/live/ を視聴者に知らせる。視聴者の環境でFlashが利用出来ない場合はHLS用ページ(index_m.html)へ自動転送される。手持ちの携帯端末で視聴する場合は必要に応じてプライベートIPを使う。
HlsLauncher.jsはWSH用のJavaScriptで記述されたスクリプトファイル。テキストエディタで編集可能。これを使うことで手間をかなり削減できる。
スクリプトの処理内容は次の通り。
スクリプトの処理内容は次の通り。
- VLCのインストール場所をレジストリから取得
- FlazrDumperの利用ポート番号を設定ファイルから取得
- フォルダ構成にあわせたVLCコマンドラインを生成
- VLCを起動
- 終了したら生成されたtsファイル群を削除
HlsLauncher.jsの代わりにHlsLauncher_iPad.jsを使うとVLC内蔵x264により再エンコードされたデータが出力される。
HlsLauncher_iPad.jsでは解像度は2/3にリサイズ(フルHDなら1280x720に)され2Mbpsで出力される。フルHDをデコードできない端末ではこれを使うことでたぶん見れるようになる。テキストエディタでHlsLauncher_iPad.jsを編集すれば任意のx264オプションを指定可能。ただし、h264エンコードを行うためそれなりにCPU負荷がある。
HlsLauncher_iPad.jsでは解像度は2/3にリサイズ(フルHDなら1280x720に)され2Mbpsで出力される。フルHDをデコードできない端末ではこれを使うことでたぶん見れるようになる。テキストエディタでHlsLauncher_iPad.jsを編集すれば任意のx264オプションを指定可能。ただし、h264エンコードを行うためそれなりにCPU負荷がある。
タグ
コメントをかく