Web インタフェース

Web インタフェースの再設計のビデオ キャプション: VRED 2021.1 では、Web インタフェースのホーム ページが再設計され、ホーム ページが大幅に見やすくなり、さまざまなデバイスやウィンドウ サイズに合わせてサイズを変更できるようになりました。さらに、VRED Stream アプリにオプションが追加され、H264 コーデックがインストールされている場合は、これと JPEG を切り替えられるようになりました。また、ビット レートと品質の設定を変更して、接続速度に合わせて調整することもできるようになりました。その他に、fps の制限とウィンドウのスケールのオプション、すべてのデバイスの解像度をロックするオプション、レイトレーシング モードの場合の新しいダウンスケール切り替えオプションがあります。これらのすべてのオプションは、Stream アプリを使用する場合のユーザ エクスペリエンスを向上させ、柔軟性を高めます。

Web インタフェースを開く方法

お使いのバージョンの VRED にシーンをロードした状態で、ブラウザに localhost: と入力し、その後に基本設定で設定されているポート番号を入力します。たとえば、既定のポートが 8888 である場合、Web インタフェースにアクセスするには、ブラウザに localhost:8888 と入力します。

新しい Web インタフェース UI

Web インタフェースから、次の項目にアクセスできます。

ヒント:

シーン内のシーンプレートに Web インタフェースを追加するには、「VRED Stream アプリをシーンプレートにストリーミングする」を参照してください。

Web インタフェースを設定する方法

ブラウザを介して Web インタフェースにアクセスするためのポートを設定するには、Web インタフェースの基本設定を使用します。

クロスオリジン リソース共有(CORS)

次に、VRED Web インタフェースのクロスオリジン ソース共有(CORS)に関する情報を示します。CORS は、vrWebInterface.cpp 内の一部の要求でも、VREDServer 用に実装されていました。

CORS の HTTP ヘッダーが添付されています。

プリフライト(オプション) Access-Control-Allow-Origin: * Access Control Allow methods: GET,HEAD,PUT,PATCH,POST,DELETE Access Control Allow Headers: content-type

実際の要求(GET) Access-Control-Allow-Origin: *

簡単な説明:

ホストまたはポートが、現在の Web サイト/Web アプリケーションの実行場所にあるホストやポートと異なる場合に、Web アプリケーションが JavaScript を介してこの他のホストに要求を送信しようとすると、ホストはこの要求に同意します。それ以外の場合、ブラウザは要求を送信しません。

次に手順を示します。

  1. ホストが同意している場合、ブラウザは HTTP メソッド「OPTIONS」を使用して、プリフライト要求内で異なるホストまたはポートを要求します。上記の「Preflight」のように HTTP ヘッダーを使用して応答する場合は、実際の要求が使用されます。

  2. ブラウザは実際の要求を送信します。ここでも、上記のように、HTTP ヘッダーを「実際の要求」に含める必要があります。この設定は必要です。設定しないと、ブラウザは応答を処理しません。

ヘッダーの詳細とその仕組みについては、「Access-Control-Allow-Origin」および「クロスオリジン リソース共有(CORS)」を参照してください。

親ページ: VRED の基本