Detect WebVR Support with JavaScript
It's been two years since I was heavily involved with WebVR at Mozilla but, despite not contributing every day, I can see VR making leaps and bounds, from Firefox making an increased effort to Chrome pushing VR and Oculus and HTC (Vive) improving their offerings. Native games are getting better but, more importantly, browsers are getting faster and three.js and aframe are empowering incredible VR experiences with JavaScript.
Before you can serve up VR experiences, however, you need to ensure the browser supports VR experiences. To do so, you need to ensure navigator.getVRDisplays
is available:
const supportsVR = 'getVRDisplays' in navigator;
if (supportsVR) {
navigator.getVRDisplays().then(function(displays) {
// ... Load VR experience
});
}
else {
// ... Show "you need {x} browser" message
}
If navigator.getVRDisplays
is present, it's likely that the browser supports VR and AR experiences.
Virtual reality and augmented reality have the potential to change the world and enrich lives. Learning how to code VR experiences will get you ahead of the curve, and as always, coding those experiences for the browser will break down the barrier of entry!
My first professional web development was at a small print shop where I sat in a windowless cubical all day. I suffered that boxed in environment for almost five years before I was able to find a remote job where I worked from home. The first...
I was inspired when I first saw Addy Osmani's original ShineTime blog post. The hover sheen effect is simple but awesome. When I started my blog redesign, I really wanted to use a sheen effect with my logo. Using two HTML elements and...
One of the great parts of MooTools is that the library itself allows for maximum flexibility within its provided classes. You can see evidence of this in the "Class" class' implement method. Using the implement method, you can add your own methods to...
Looks like
is deprecated and should not be used any more. Oculus Quest 2 does not implement it, so it can’t really be relied on: https://discourse.threejs.org/t/navigator-getvrdisplays-not-working-on-oculus-quest-browser/23273