WebXR-compatible devices include fully-immersive 3D headsets(VR Headsets) with motion and orientation tracking, Augmented Reality glasses, like HoloLens and MagicLeap ,which overlay graphics atop the real world scene passing through the frames, and AR compatible(ARCore and ARKit supported) handheld mobile phones which augment reality by capturing the world with a camera and augment that scene with computer-generated imagery.

Virtual Reality WebXR Navigation and Teleportation Demo

Augmented Reality on Android Devices

The basic steps most WebXR applications will go through are:

1. Query to see if the desired XR mode is supported.

2. If support is available, advertise XR functionality to the user.

3. A indicates that the user wishes to use XR.

4. Request an immersive session from the device

5. Use the session to run a render loop that produces graphical frames to be displayed on the XR device.

6. Continue producing frames until the user indicates that they wish to exit XR mode.

7. End the XR session.

Different browsers are implementing and WebXR APIs in different timeframes. Currently Chrome and new Edge browsers have WebXR APIs turned on as default and some of the features are under experimental flags.

You can check the current support status at CanIUse.com.

How to try out experimental features in Chrome and Edge

You can turn on experimental flags by navigating to chrome://flags/ or edge://flags/ and searching for the experimental flag you are looking to enable and choosing enable from the drop down menu.

WebXR is a group of standards being implemented by the browsers, which are used together to support rendering 3D scenes to hardware designed for Mixed Reality. Mixed Reality devices are presenting virtual worlds (virtual reality, or VR), or for adding graphical imagery to the real world, (augmented reality, or AR).

The WebXR Device API implements the core of the WebXR feature set, managing the selection of output devices, render the 3D scene to the chosen device at the appropriate frame rate, and manage input, such as controllers and hand interactions.

WebXR Device APIs are replacing the deprecated WebVR API. WebVR API was designed with only VR devices in mind. With the addition of new AR headsets and AR capable handheld devices, the WebVR API is deprecated in favor of WebXR Device APIs, that include AR Modules.

• Introduction

• WebXR Device APIs:

• Immersive Devices

• VR Headsets for Mobile Devices.

• Oculus Quest

• Augmented Reality(AR) or Mixed Reality(MR) Headsets

• WebXR with Mobile Devices

• Pokemon Go

• WebVR vs WebXR

• Virtual Reality on the Web

• Mozilla Hello WebXR Demo:

• WebXR Features 11: 30 Gamepad API

• Input Profiles Library

• WebAR Module

• Hit Test

• How to Get Started Building WebXR Experiences

• WebGL

• WebXR Libraries

• ThreeJS:

• A-Frame:

• BabylonJS:

• React 360:

• PlayCanvas:

• More on A-Frame

• A-Frame Hello World Code

• Future of WebXR APIs

• WebXR Accessibility and DOM Overlay API

• Lighting Estimation Using Computer Vision

• Anchors

• Layers

• Hand Interactions

• WebXR Resources 30: 10 How to Get Involved with Immersive Web Working and Community Groups

XRReferenceSpaceType defines how much your user can move in you experience.