This Wonderland Engine project is meant to demonstrate the capabilities of WebXR on a VR device such as the Meta Quest or Huawei VR Glass.
The game is set in a farm and the objective is to shoot all the rats that appear.
Please note that all development and testing was conducted with Google Chrome, Meta Quest, and Huawei VR Glass.
This part is common to both the Quest and HVR Glass.
- Clone this project: https://github.com/hms-ecosystem/Wonderland-Demo.git.
- Download and install the Wonderland Engine Editor.
- Download the asset files and place them into the project directory.
- Open the project in the Wonderland Editor.
- Open the Chrome Inspect Devices page.
- Enable both
Discover USB devices
andDiscover network targets
- Click on the
Port forwarding...
button- Add 8080 as the
Port
value . - Add localhost:8080 as the
IP address and port
value. - Check the
Enable port forwarding
option.
- Add 8080 as the
- Click on the
Configure...
button- Add localhost:8080 as a new value for
IP address and port
- Check the
Enable port forwarding
option.
- Add localhost:8080 as a new value for
- Back in the Wonderland Editor, package and start the server.
- Enable Developer Mode on the Meta Quest phone app.
- Plug the Quest into the computer.
- On the Quest, accept the "allow debugging" prompt.
- The Quest should now show up on
adb devices
. Additionally, the device should also show up underRemote Targets
on Chrome Inspect. - Launch either the Oculus Browser or Wolvic VR Browser and connect to http://localhost:8080/index.html
- The VR experience should be available.
Unlike the Meta Quest, which is a standalone device, the HVR glass works in conjunction with a VR compatible Huawei phone. The HVR glass takes up the USB port of the phone, which means ADB over USB is not possible and we have to use ADB over Wi-FI.
- Enable USB debugging on your HVR compatible Huawei phone.
- Enable ADB over Wi-Fi
- Connect both the phone and the computer to the same Wi-Fi network.
- Plug the phone into the computer.
- On the computer command line enter:
adb tcpip 5555
- On the computer command line enter:
adb shell ip addr show wlan0
and copy the IP address after the "inet" until the "/". Alternatively, you can also go inside the phone settings to retrieve the IP address in Settings → About → Status. - On the computer command line enter:
adb connect <ip-address-of-device>:5555
- You can now disconnect the USB cable and check
adb devices
that the device is still detected. The device should also show up underRemote Targets
on Chrome Inspect. - Back on the Wonderland Editor, navigate to Views > Preferences > Server
- Check
SSL enabled
- Get OpenSSL (also available with Git)
- Generate an SSL certificate file:
openssl genrsa -des3 -out domain.key 2048
. Process overview. - Generate an SSL key file:
openssl req -key domain.key -new -out domain.csr
. - Generate an SSL dh parameters file:
openssl dhparam -out dhparam.pem 1024
. - Add the SSL certificate, key, passphrase, and dh params file to the server page.
- Check
- On the HVR Glass, launch either the Wolvic VR Browser and connect to https://localhost:8080/index.html
- The VR experience should be available.
This Wonderland Engine sample code is licensed under the Apache License, version 2.0
The code in this project was based off the Wonderland Engine Wastepaperbin AR game.