Home

Awesome

YUKIMOCHI VRChat HLS Bridge

これはなに？

VRChat で各種ライブストリーミングを視聴するためのナビゲーションを提供する Web サービスです。

（ナビゲーション：番組管理機能・アドレス解析機能・リダイレクト機能）

対応ライブストリーミングサービス

概要

ライブストリーミングをワールド全員で WebPanel から見ることのできるサービスです。

また、3つまで番組をブラウザから登録でき、それをワールドからリアルタイムで確認・番組変更できる番組カタログ機能が搭載されています。

Preview

提供方法

この Web サービスは、3種類の方法で提供されます。

https://vrchat-hls-bridge.herokuapp.com

Deploy

Twitch.tv の情報取得を行う場合

以下の環境変数に Twitch Developer Application の Client ID を設定してください。

使い方

はじめに

このサービスでは インスタンスキー と呼ばれる、ワールドと当サービスの間で共有するキーワードによって、番組管理をはじめとする各種サービスを提供します。これは、ワールド設置者が設定してワールドに埋め込むものです。

したがって、 インスタンスキー が知れ渡ると、見ず知らずのユーザーにより番組管理を勝手に行われる可能性があります。当サービスを利用される場合、ワールドの更新が容易な Unlisted ワールドでご利用ください。このサービスにより発生した全ての障害・事故について一切の責任を負いかねます。

1. インスタンスキー を決定する

VRChat HLS Bridge とワールドを接続する インスタンスキー を決定します。 （英数記号漢字を使うことができます）

以下の利用状況の確認方法でインスタンスキーに登録されている番組を確認できるので、利用されていないことを確認します。（重複した場合の折衝機能はありません。）

利用状況の確認方法： https://vrchat-hls-bridge.herokuapp.com/static/dashboard.html?sid=<利用したいインスタンスキー>

※ <利用したいインスタンスキー> を希望のインスタンスキーに置き換えてアクセスしてください。

2. ワールドに2つの WebPanel と 3つの VRC_Trigger を配置します。

WebPanel

  1. Resolution Width : 1940 (必須), Resolution Height : 1100 である WebPanel_A
  2. Resolution Width : 1080, Resolution Height : 600 程度の WebPanel_B

WebPanel_A は、動画の上映を行う WebPanel です。 Start URI は、 about:blank を指定します。

WebPanel_B は、番組カタログ（確認方法で表示される画面）を表示する WebPanel です。

https://vrchat-hls-bridge.herokuapp.com/static/dashboard.html?sid=<利用したいインスタンスキー>

https://vrchat-hls-bridge.herokuapp.com/static/dashboard.html?key=hidden&sid=<利用したいインスタンスキー>

VRC_Trigger

OnInteract で始動する AlwaysBufferOne の VRC_Trigger を3つ用意し、それぞれに以下の通りの Actions を登録します。

※ いずれも Receiver に WebPanel_A を指定します。

これらの VRC_Trigger を Interact した際に、 WebPanel_A にカタログに登録されているライブストリーミングが再生されます。

3. ブラウザからライブストリーミングを登録します。

https://vrchat-hls-bridge.herokuapp.com

こちらから、 <利用したいインスタンスキー> を Instance Key に入力し、 LiveStream URL に生放送のURLを入力し Add Playlist を確定します。

確認画面で生放送を確認して、再度 Add Playlist を確定すると、 <利用したいインスタンスキー> のチャンネルにライブストリーミングが登録されます。（3件登録済みの場合、登録が最も古いものから上書きされます。）

※ インスタンスキー ごとに最終登録から 8時間が経過すると登録内容は抹消されます。

4. ライブストリーミングの登録は、ワールドの WebPanel_B に30秒以内に反映されます。

視聴したいチャンネルの VRC_Trigger を Interact して、ワールドの WebPanel_A で生放送を見ることができます。

5. 色合いがおかしい件の修正。

WebPanel では、色の発色がおかしいという現象が見つかっています。

Duplicate Screen で、 yukimochi/WebPanel-Shaders などの代替シェーダを適用します。

使い方（応用）

音量変更を行う javascript 関数について

javascript の audio_control 関数を実行することで、オーディオの音量を変更できます。

audio_control (volume:Number)

例：( Set-WebPanelURI や ブックマークレット)

javascript:setTimeout(audio_control(50),0);

Heroku や 独自のサーバを構築された場合

上記の使い方に表示されているドメイン(https://vrchat-hls-bridge.herokuapp.com)をご自身のドメインに置き換えます。

m3u8 ファイルに直接リダイレクトしたい場合

手順2で設定した URL は、動画プレイヤーへのリダイレクトを行いますが、直接 m3u8 にリダイレクトさせたい場合があるかもしれません。

以下の URL を利用して直接 m3u8 のアドレスへのリダイレクトを提供します。