coderef

WebXRLimited availability

The navigator.xr API represents the browser's virtual reality or augmented reality system. You can use to request a WebXR session.

Not yet supported in all major browsers — check the table and provide a fallback.

Browser support

DesktopChrome
1–78Not supported
79+Supportedsince Dec 10, 2019
Current: 155
Edge
12–18Not supported
79+Supportedsince Jan 15, 2020
Current: 154
Firefox
✕Not supportedup to 157
Current: 157
Safari
✕Not supportedup to 27
Current: 27
MobileChrome Android
18–78Not supported
79+Supportedsince Dec 17, 2019
Current: 155
Firefox Android
✕Not supportedup to 157
Current: 157
Safari iOS
✕Not supportedup to 27
Current: 27

How to use

Not supported in Firefox, Safari, Firefox Android, Safari iOS. Use feature detection below and provide a fallback (or a polyfill) for those browsers.

Example

Full syntax and examples are on MDN: xr.

Feature detection

JS · check before using
if ("ondevicechange" in XRSystem.prototype) {
  // the devicechange event is supported
}

Sub-features

Support for each part of the feature (107). The overall table above shows when the whole feature works.

Sub-featureChromeEdgeFirefoxSafariChrome AndroidFirefox AndroidSafari iOS
Navigator.xr7979✕✕79✕✕
WebGL2RenderingContext.makeXRCompatible7979✕✕79✕✕
WebGLRenderingContext.makeXRCompatible7979✕✕79✕✕
XRBoundedReferenceSpace7979✕✕79✕✕
XRBoundedReferenceSpace.boundsGeometry7979✕✕79✕✕
XRFrame7979✕✕79✕✕
XRFrame.getPose7979✕✕79✕✕
XRFrame.getViewerPose7979✕✕79✕✕
XRFrame.session7979✕✕79✕✕
XRInputSource7979✕✕79✕✕
XRInputSource.gripSpace7979✕✕79✕✕
XRInputSource.handedness7979✕✕79✕✕
XRInputSource.profiles7979✕✕79✕✕
XRInputSource.targetRayMode7979✕✕79✕✕
XRInputSource.targetRaySpace7979✕✕79✕✕
XRInputSourceArray7979✕✕79✕✕
XRInputSourceArray.@@iterator7979✕✕79✕✕
XRInputSourceArray.entries7979✕✕79✕✕
XRInputSourceArray.forEach7979✕✕79✕✕
XRInputSourceArray.keys7979✕✕79✕✕
Show 87 more
Sub-featureChromeEdgeFirefoxSafariChrome AndroidFirefox AndroidSafari iOS
XRInputSourceArray.length7979✕✕79✕✕
XRInputSourceArray.values7979✕✕79✕✕
XRInputSourceEvent7979✕✕79✕✕
XRInputSourceEvent.XRInputSourceEvent7979✕✕79✕✕
XRInputSourceEvent.frame7979✕✕79✕✕
XRInputSourceEvent.inputSource7979✕✕79✕✕
XRInputSourcesChangeEvent7979✕✕79✕✕
XRInputSourcesChangeEvent.XRInputSourcesChangeEvent7979✕✕79✕✕
XRInputSourcesChangeEvent.added7979✕✕79✕✕
XRInputSourcesChangeEvent.removed7979✕✕79✕✕
XRInputSourcesChangeEvent.session7979✕✕79✕✕
XRLayer8484✕✕84✕✕
XRPose7979✕✕79✕✕
XRPose.angularVelocity✕✕✕✕✕✕✕
XRPose.emulatedPosition7979✕✕79✕✕
XRPose.linearVelocity✕✕✕✕✕✕✕
XRPose.transform7979✕✕79✕✕
XRReferenceSpace7979✕✕79✕✕
XRReferenceSpace.getOffsetReferenceSpace7979✕✕79✕✕
XRReferenceSpace.reset_event7979✕✕79✕✕
XRReferenceSpaceEvent7979✕✕79✕✕
XRReferenceSpaceEvent.XRReferenceSpaceEvent7979✕✕79✕✕
XRReferenceSpaceEvent.referenceSpace7979✕✕79✕✕
XRReferenceSpaceEvent.transform7979✕✕79✕✕
XRRenderState7979✕✕79✕✕
XRRenderState.baseLayer7979✕✕79✕✕
XRRenderState.depthFar7979✕✕79✕✕
XRRenderState.depthNear7979✕✕79✕✕
XRRenderState.inlineVerticalFieldOfView7979✕✕79✕✕
XRRigidTransform7979✕✕79✕✕
XRRigidTransform.XRRigidTransform7979✕✕79✕✕
XRRigidTransform.inverse7979✕✕79✕✕
XRRigidTransform.matrix7979✕✕79✕✕
XRRigidTransform.orientation7979✕✕79✕✕
XRRigidTransform.position7979✕✕79✕✕
XRSession7979✕✕79✕✕
XRSession.cancelAnimationFrame7979✕✕79✕✕
XRSession.enabledFeatures111111✕✕111✕✕
XRSession.end7979✕✕79✕✕
XRSession.end_event7979✕✕79✕✕
XRSession.inputSources7979✕✕79✕✕
XRSession.inputsourceschange_event7979✕✕79✕✕
XRSession.renderState7979✕✕79✕✕
XRSession.requestAnimationFrame7979✕✕79✕✕
XRSession.requestReferenceSpace7979✕✕79✕✕
XRSession.select_event7979✕✕79✕✕
XRSession.selectend_event7979✕✕79✕✕
XRSession.selectstart_event7979✕✕79✕✕
XRSession.squeeze_event8383✕✕83✕✕
XRSession.squeezeend_event8383✕✕83✕✕
XRSession.squeezestart_event8383✕✕83✕✕
XRSession.updateRenderState7979✕✕79✕✕
XRSession.visibilityState7979✕✕79✕✕
XRSession.visibilitychange_event7979✕✕79✕✕
XRSessionEvent7979✕✕79✕✕
XRSessionEvent.XRSessionEvent7979✕✕79✕✕
XRSessionEvent.session7979✕✕79✕✕
XRSpace7979✕✕79✕✕
XRSystem7979✕✕79✕✕
XRSystem.devicechange_event7979✕✕79✕✕
XRSystem.isSessionSupported7979✕✕79✕✕
XRSystem.requestSession7979✕✕79✕✕
XRView7979✕✕79✕✕
XRView.eye7979✕✕79✕✕
XRView.projectionMatrix7979✕✕79✕✕
XRView.recommendedViewportScale9090✕✕90✕✕
XRView.requestViewportScale9090✕✕90✕✕
XRView.transform7979✕✕79✕✕
XRViewerPose7979✕✕79✕✕
XRViewerPose.views7979✕✕79✕✕
XRViewport7979✕✕79✕✕
XRViewport.height7979✕✕79✕✕
XRViewport.width7979✕✕79✕✕
XRViewport.x7979✕✕79✕✕
XRViewport.y7979✕✕79✕✕
XRWebGLLayer7979✕✕79✕✕
XRWebGLLayer.XRWebGLLayer7979✕✕79✕✕
XRWebGLLayer.antialias7979✕✕79✕✕
XRWebGLLayer.fixedFoveation✕✕✕✕✕✕✕
XRWebGLLayer.framebuffer7979✕✕79✕✕
XRWebGLLayer.framebufferHeight7979✕✕79✕✕
XRWebGLLayer.framebufferWidth7979✕✕79✕✕
XRWebGLLayer.getNativeFramebufferScaleFactor_static7979✕✕79✕✕
XRWebGLLayer.getViewport7979✕✕79✕✕
XRWebGLLayer.ignoreDepthValues7979✕✕79✕✕
iframe.allow.xr-spatial-tracking7979✕✕79✕✕
http.headers.Permissions-Policy.xr-spatial-tracking8888✕✕88✕✕