前回:
【IT備忘録】NginxでHLS形式でライブストリーミング 〜THETA VでVRアプリ製作 - ブラック研究室へようこそ!
やりたいことの全体像は、以下の図のとおりです。
前回、自作でストリーミングサーバを構築できたので、いよいよクライアント側。
そう、Unityへの着手です。
準備するもの
ソフトウエア系
- Unity(当然、僕はPersonal版です)
- Google VR SDK for Unity
- @warapuri氏が提供している天球モデル「Sphere100.fbx」
ハード系
- VRゴーグル(確認用に買いました)
スマホをガチャっとはめるタイプのあれです。
ただの確認用なので、以下のような、千円代で買える手軽なものをチョイスしました。
①UnityにGoogle VR SDKをインポート
今回、HLS形式のライブ映像をUnityで再生したいのですが、
デフォルトで用意されている「Video Player」コンポーネントでは再生できません…。
調べたところ、どうやらGoogle VR SDKのビデオ再生コンポーネントを利用すると、HLS形式が再生可能ということで、導入します。
以下のページを参考にさせていただきました。
Google VR SDK for Unityの .unitypackageファイルをダウンロードし、クリックで開きます。
すると、自動でプロジェクトへ「import」できるのでインポートしてしまいます。
これだけだと、まだビデオ再生用のコンポーネントは利用できないので、
「Assets」→新しくできた「Google VR」内の「GVRVideoPlayer.unitypackage」をダブルクリックして、さらにこいつもインポートして下さいね。
これで下準備はOKです!
②天球モデルを置き、ビデオ再生コンポーネントをセット
今回、360度のライブ映像を投影するスクリーンにあたるモデルですが、
@warapuri氏が提供している天球モデル「Sphere100.fbx」を使います。
ダウンロードしたら、Assets内へD&Dして追加します。
その後、Assets内から、SceneへもD&Dして、画面へモデルを置きます。
「Inspector」の「Transform」のパラメーターは、
Position:X・Y・Zともに0
Scale:X・Y・Zともに100
としちゃいます。
次に、このモデルのマテリアルを、ライブ映像が投影できるものに変更します。
「Inspector」の「Mesh Render」内の「Materials」→「Element 0」を『VideoMono』へ変更。
そして、ライブ映像再生用のコンポーネントを追加したいので、
「Inspector」→「Add Component」から、
『Scripts』→『Gvr Video Player Texture』を選んで追加します。
Video Type、Video URLを図のように指定します。
※Video URLですが、http://IPアドレス/hls/は、前回のNginxでの設定に基づきます。
test.m3u8の「test」の部分ですが、ストリームキーと呼ばれるもので、
OBSで映像転送をする時に、指定するものになります。
自動的に再生を開始したいので、もう1個コンポーネントを追加します。
「Inspector」→「Add Component」から、検索して、『Auto Play Video』を追加。
こんなイメージになるでしょうかね。
これでUnity側の準備は完了です。
※なんとこのGoogle VR SDK、このPC上で「Run」(再生ボタン押下)をしてみても動かないんですが、実機にビルドするとちゃんと動く仕様みたいですね。
実機(Android・iOS)へのビルド方法は、以下が参考になるかと思います。
③OBSでTHETAのライブ映像を転送してみる
とうとうここまで来ました。
配信設定をします。
・配信種別:カスタムストリーミングサーバー
・URL:rtmp://IPアドレス/live
→「live」は、前回のNginxで設定(nginx.conf)した、「application live」に準じています。
・ストリームキー:test
→先程のやつです。Unity上で「test.m3u8」とURL指定した『test』に合わせます。
そして、配信開始をクリック!
配信が開始されました。
実機にビルドしたUnityアプリを見てみると…
見れました!(わかりにくいですが、上図はアプリのキャプチャです…)
完成!
というわけで、THETA Vの360度ライブ映像を、自作サーバを介してアプリに配信することができました。
ここからどう工夫していくかが腕の見せ所、といった感じでしょうか。
では、また!!!