"Error initializing XR" / "WebXR not available" (solved)

tl;dr; If you’re using NPM modules and building your javascript with build tools, make sure you are testing with a production build - OR use chrome port forwarding instead of tunnelling.

I was about to post this as a bug to see if anyone had experienced it before, but I ended up finding a solution. I am posting this in case anyone runs into the situation under the same circumstances.

I was setting up a scene with the Default XR helper inside of my Gatsby site.
Locally, while using chrome and the WebXR plugin, the scene was initializing fine and the button to ‘enter the scene’ was rendered properly, and I could click on it.
I created a tunnel to my machine through Ngrok to do some testing inside an actual device.
I went to test it in my Oculus Quest 2 and neither FireFox Reality nor the default browser would show the button.

I put the Quest 2 into developer mode, and connected it to my machine via USB, and was able to use chrome://inspect to debug what was happening.

It was showing an “Error initializing XR” error.

This was odd since it was working perfectly locally inside of chrome.

I then built the site for production so I could publish it for others to see before opening an issue.

And then the problem was solved.

I didn’t dig into the specific root cause, but it had something to do with running the site in development mode with hot-reloading and other things enabled and also running in through the tunnel.

With the page properly built in production mode everything worked as expected.

Alternatively, to test your scenes from your local dev machine without the error.
Connect the device to the computer via usb
On your machine, in Chrome, browse to chrome://inspect and enable port forwarding.
e.g. if you are running a server at port 8000, enable port forwarding for port 8000 pointing to 127.0.0.1:8000.
In your connected device open a browser window and browse to http://localhost:8000 and you should see whatever your local dev server is serving up.

I hope that helps someone in their journey.

2 Likes

Thanks a lot for your post!

Thanks a lot! I’ve been experimenting with WebXR for a while and just couldn’t get it working properly in my Quest, until I see your post.

It seems WebXR only works when using “https” or localhost. I didn’t realize it before.
When I host my site under “http” or start a server from my own ip address (using live server extension with VS Code), I see “Error initializing XR” error and didn’t see the enter XR button.