» VR開発メモトップへ

Unity + WebXR開発メモ（Oculus Quest、Chrome、Firefox対応）

最終更新日：2022年01月15日

Unityでブラウザで動作するVRアプリを開発する方法についてまとめています。

更新履歴

（2022年1月15日）「コントローラーのグラフィックスを表示するには」を追加
（2022年1月13日）「トラッキング基準位置を変更するには」を追加
（2022年1月11日）WebXR Export 0.14.0のUnity 2021.2対応について注記
（2021年12月17日）Unity 2021.2でのビルドについて追記、「QuestでブラウザのURLを簡単に開くには」を追加
（2021年12月2日）いっこうさんの記事のリンクを2021年版に

ブラウザのVR/AR対応について

WebXR Device APIをはじめとした一連のAPIがあり、ブラウザでVR/ARアプリケーションを動かすことができます。いわゆるWebXR全体の概況をつかむにはいっこうさんの記事がおすすめです。

Oculus Quest

Oculus Questの標準ブラウザ（Oculus Browser）はWebXRに対応しています。WebXR対応ページに設置されているボタンを押すとVRモードに入り、コントローラーのOculusボタンを押すとVRモードを抜けるようになっています。

Oculus BrowserはChromiumベースで、下記ページにアップデート情報があります。

Chrome / Firefox（Windows）

WindowsのChromeおよびFirefoxは現在標準でWebXRに対応しています。別途OculusソフトウェアやSteam VRのインストールが必要です。ChromeとFirefoxはKhronosのOpenXR規格を利用しており、ページに設置されているVRモードのボタンを押すと、現在アクティブになっているOpenXRランタイムを使用してVRモードに入ります。ヘッドセットをはずすとVRモードを抜けます。OculusソフトウェアやSteam VRの設定で、使用するOpenXRランタイムを選択します（下記画像を参照）。

UnityでWebXRアプリを作るには

De-Panther氏のWebXR Exportを使用すると、UnityのWebGLビルドを使用してブラウザで動作するVRアプリケーションを開発できます。

パフォーマンスは大丈夫？

ブラウザでVRアプリを動かす場合に気になるのは実用的に動くかどうかでしょう。

特にQuestにおいて、Unityから出力したWebXRアプリは、以前（2020年4月頃）はフレームレートがとても低かったり、起動に数十秒かかったりと厳しかったのですが、2022年1月現在、起動後少し待つと90fps出るようになったり（想像ですが、V8のLiftoffとTurboFanの2段構えのコンパイラの挙動でしょうか）、起動時間も最短で数秒から済むようになったりと大幅に状況が改善しています。

あくまでウェブページなので、大容量のアセットのコンテンツはページ表示の待ち時間やサーバー料金で厳しいです。特にテクスチャは最小限に留めてインポート設定に注意し、場合によってはAssetBundleを利用する必要がありそうです。

また、アセットの多いコンテンツを再生すると（特にQuestで）メモリオーバーフローのエラーが出るので注意が必要です。

WebXR Exportを使用する

WebXR Exportの導入方法はこちらにあります。以下、サンプルシーンをビルドする手順のメモです。

  • Unity 2021.2で新規プロジェクトを作成し、プラットフォームをWebGLにする
  • Project Settings > Package Managerを開いて、Scoped Registriesに以下を追加
  • Window > Package ManagerでMy Registriesに変更するとWebXR Export、WebXR Interactionsが出てくるのでインポート
  • WebXR InteractionsパッケージのSamplesからSample Sceneをインポート
  • Desertシーンを開く（Assets/Samples/WebXR Interactions/[version]-preview/Sample Scene/Scenes/Desertにあります）
  • Project Settings > XR Plug-in ManagementのWebGLタブでWebXR Exportにチェックを入れる
  • Window > WebXR > Copy WebGLTemplates を実行
  • Player Settings > Publishing SettingsのDecompression Fallbackをオンにしておく（サーバーがBrotli圧縮に対応していない場合に備えて）
  • Player Settings > Resolution and PresentationのWebGL TemplateでWebXR2020またはWebXRFullView2020あたりを選択してビルド（WebXR、WebXRFullViewだと動きません）

あとは生成されたページをブラウザで開けばオーケーです。

下記スライドも参照してください（古いので注意点くらいしか参考にならないかも……そのうちページのほうに移植します）。

コントローラーのグラフィックスを表示するには

さらにWebXR Input Profiles Loaderをインストールすると、WebXR Input Profilesを使用して、接続されているヘッドセットに応じてコントローラーのグラフィックスが変化します。なお、ビルド後のサイズが3MBほど大きくなります。

以下の容量でインストールできます。

  • Project Settings > Package ManagerのOpenUPMのScope(s)にcom.attenederを追加する
  • Package ManagerのMy RegistriesからWebXR Input Profiles Loaderパッケージをインストールする
  • Project Settings > Graphicsの下のほうにあるPreload Shadersに、ProjectウィンドウのPackages/WebXR Input Profiles Loader/Runtime/ShaderVariantsに入っているGLTFShaderVariantsを登録する

WebXRCameraSetについて

WebXR ExportのカメラリグはWebXRCameraSetプレハブを使用します。WebXRCameraSet/Camerasが通常時・VRモード・ARモードのカメラを子に持っており、WebXRCamera.csがモードによってカメラを切り替えています。

なお、カメラの子にゲームオブジェクトをアタッチしたい場合は、CameraMainではなくCameraFollowerの子にする必要があります（CameraMainだとビルドしたときに動かなくなります）。

トラッキング基準位置を変更するには

Project Settings > XR Plug-in Management > WebXR > VR Required Reference SpaceをLocalにするとWebXRCameraSetプレハブの位置が頭の位置に、Local_floorにすると床の位置になります。

コントローラーの入力を取得するには

WebXRCameraSetプレハブのhandL、handRオブジェクトにアタッチされているWebXRController.csのGetAxis2DやGetButtonメソッドでコントローラーの状態を取得できます。例えば、

using WebXR;
...
[SerializeField] WebXRController leftHandWebXRController;
...
leftHandWebXRController.GetAxis2D(WebXRController.Axis2DTypes.Thumbstick);

でOculus Questのサムスティックの入力値が取得できます。

XR Interaction Toolkitは使える？

2022年1月現在まだ使用できません。WebXRCameraSetはWebXR Interactionsを使用するリグになっており、今のところWebXR InteractionsはXR Interaction Toolkitとは無関係なサンプルになっています。

エディタでVRモードで再生するには

WebXRCameraSetはOculus XR Pluginでも動作しますので、エディタからOculus Linkで再生できます。Project Settings > XR Plugin ManagementでStandaloneタブのOculusのチェックを入れて、プラットフォームをWindowsに変更して再生してみてください。

また、そのままビルドしてOculus Linkで動作する実行ファイルを作ることも可能です。

ビルドサイズを小さくするには

「Unityのビルドサイズを小さくするには」にWebGLビルドを省サイズ化する方法についてまとめてみました。

Oculus Browserでデベロッパーツールを使用するには

PCのChromeからリモートのデベロッパーツールを開くことができます。開発者モードにしたQuestをUSB接続している（adb devicesで表示される）状態で、PCのChromeで chrome://inspect/#devices を開いて少々待つとQuestが検索表示されますので、inspectをクリックしてください。

QuestでブラウザのURLを簡単に開くには

QuestのソフトウェアキーボードでURLを入力するのは大変です。

Questの開発支援ツールであるOculus Developer Hubをインストールすると、Device ManagerタブのDevice Actions > Oculus BrowserにURLを入力して簡単にページを開くことができます。

また、上記のChromeのデベロッパーツールでもURLを入力して開くことができます。

Unity公式のWebXRサポートは？

Unity公式によるWebXRサポートは、ロードマップによるとUnder Consideration（検討中）になっています（2022年1月現在）。現在WebGLのモバイルサポートを優先している雰囲気で、だいぶ先になりそうです。

書いた人：こりん（@korinVR）
» VR開発メモトップへ