Web VR Basic experience

I have many questions about VR! :smiley:

Firstly I noticed my VR games stay stuck on chrome with an hour glass icon and just forever loads. I have an Oculus Rift S and I use on my main PC, and it works just fine when I use Mozilla or Edge. Chrome is my prefer browser and I’d like to know what’s up.

Secondly is there a simple way of just recognizing the VR controls simply, like I would with a gamepad/keyboard/etc

For example for the keyboard I commonly do this to map W to a move forward function.


But when I dissect the vr controls, there are like 3 different scripts and I’m not entirely sure which one is talking to who. It isn’t as intuitive as the above example. Or if it is, can someone please explain :smiley: I’m still much a coding newb.

Thirdly what are the BARE bones to run a VR experience. Meaning, launching it and the user is inside, no user controls/movement needed, just a simple static VR experience. Where they simply hop in and can just explore the space. I made a basic test but then noticed it wouldn’t launch on Mozilla, and now only on Edge. But some further insight would be helpful.


Just to check, are you using WebVR or the newer WebXR APIs?

Have you tried the VR section of the tutorials section: https://developer.playcanvas.com/en/tutorials/?tags=vr

It’s possible that Mozilla haven’t yet been updated to use the WebXR APIs?

I’m using webxr I think. I’m using the base template when starting a new project. But the links you sent are gonna be helpful. I’ll dig deeper

Not sure if I solved it yet but this seems to be the solution! I enabled these settings found below. This seemed to fix it for Chrome.

And I investigated that this is not the case for Mozilla, seems like they have not updated or at least appears to be. And for what it’s worth. Edge has NO issue at all. Just works no matter what from my experience. Microsoft being sneaky with they VR? :wink:

1 Like

Probably related to the Holo lens?

Yea making sure they always on top of it.

Speaking of on top of it. I noticed a few things with the tutorial projects and why some work and others don’t. Or at least a clue to why.

Here is this project that does not work on Mozilla and if you notice in the scripts, it only has these

And here is the other controller based tutorial but it has webxr-polyfill, that worked fine in Mozilla.

I found this to be true with all the ones that either worked or did not support WebXr on the tutorials page. Perhaps all yall need to do is add the webxr-polyfill and you should be good to go!

It also explained when I did my blank project and tried to build from the ground up that it didn’t work on Mozilla, because I was missing that piece of the puzzle. Hope that helps.

1 Like

Odd that Firefox needs the polyfill :thinking: I would have thought they would be on top of this stuff

More examples!

Also you can go to my site and scope it out!

1 Like