XRSystem | Web API

在此页

特性
方法
事件
用法注意事项
范例
规范
浏览器兼容性
相关话题

安全上下文
此特征只可用于安全上下文 (HTTPS)，在某些或所有支持浏览器 .

WebXR 设备 API interface XRSystem provides methods which let you get access to an XRSession object representing a WebXR session. With that XRSession in hand, you can use it to interact with the Augmented Reality (AR) or Virtual Reality (VR) device.

特性

While XRSystem directly offers no properties, it does inherit properties from its parent interface, EventTarget .

方法

In addition to inheriting methods from its parent interface, EventTarget ， XRSystem interface includes the following methods:

isSessionSupported(): Returns a promise which resolves to true if the browser supports the given XRSessionMode . Resolves to false if the specified mode isn't supported.
requestSession(): Returns a promise that resolves to a new XRSession 采用指定 XRSessionMode .

事件

devicechange: Sent when the set of available XR devices has changed.
Also available using the ondevicechange event handler.

用法注意事项

Thsi interface was previously known as simply XR in earlier versions of the specification; if you see references to XR in code or documentation, simply replace that with XRSystem .

范例

The following example shows how to use both isSessionSupported() and requestSession() .

if (navigator.xr) {
  immersiveButton.addEventListener("click", onButtonClicked);
  navigator.xr.isSessionSupported('immersive-vr')
  .then((isSupported) => {
    if (isSupported) {
      immersiveButton.disabled = false;
    } else {
      immersiveButton.disabled = true;
  });
}
function onButtonClicked() {
  if (!xrSession) {
    navigator.xr.requestSession('immersive-vr')
    .then(() => {
      // onSessionStarted() not shown for reasons of brevity and clarity.
      onSessionStarted(xrSession);
    });
  } else {
    // Shut down the already running XRSession
    xrSession.end()
    .then(() => xrSession = null);
  }
}

This code starts by checking to see if WebXR is available by looking for the navigator.xr property. If it's found, we know WebXR is present, so we proceed by establishing a handler for the button which the user can click to toggle immersive VR mode on and off.

However, we don't yet know if the desired immersive mode is available. To determine this, we call isSessionSupported() , passing it the desired session option before enabling the button, immersiveButton , which the user can then use to switch to immersive mode only if immersive VR mode is available. If immersive VR isn't available, the button is disabled to prevent its use.

onButtonClicked() function checks to see if there's already a session running. If there isn't, we use requestSession() to start one and, once the returned promise resolves, we call a function onSessionStarted() to set up our session for rendering and so forth.

If, on the other hand, there is already an ongoing XR session, we instead call end() to end the current session. When the returned promise resolves, we set xrSession to null to record the fact that we no longer have an ongoing session. That way, if the user clicks the button again, a new session will start.

规范

规范	状态	注释
WebXR 设备 API The definition of 'XR' in that specification.	工作草案	初始定义。

浏览器兼容性

The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request. 更新 GitHub 上的兼容性数据

	桌面						移动
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Chrome for Android	Firefox for Android	Opera for Android	Safari on iOS	Samsung Internet
`XRSystem`	Chrome 79 Alternate Name 79 Alternate Name Alternate Name Uses the non-standard name: `XR`	Edge 79 Alternate Name 79 Alternate Name Alternate Name Uses the non-standard name: `XR`	Firefox 不支持 No	IE 不支持 No	Opera 不支持 No	Safari 不支持 No	WebView Android 不支持 No	Chrome Android 79 Alternate Name 79 Alternate Name Alternate Name Uses the non-standard name: `XR`	Firefox Android 不支持 No	Opera Android 不支持 No	Safari iOS 不支持 No	Samsung Internet Android 11.2 Alternate Name 11.2 Alternate Name Alternate Name Uses the non-standard name: `XR`
`devicechange` event	Chrome 79	Edge 79	Firefox 不支持 No	IE 不支持 No	Opera 不支持 No	Safari 不支持 No	WebView Android 不支持 No	Chrome Android 79	Firefox Android 不支持 No	Opera Android 不支持 No	Safari iOS 不支持 No	Samsung Internet Android 11.2
`isSessionSupported()`	Chrome 79	Edge 79	Firefox 不支持 No	IE 不支持 No	Opera 不支持 No	Safari 不支持 No	WebView Android 不支持 No	Chrome Android 79	Firefox Android 不支持 No	Opera Android 不支持 No	Safari iOS 不支持 No	Samsung Internet Android 11.2
`ondevicechange`	Chrome 79	Edge 79	Firefox 不支持 No	IE 不支持 No	Opera 不支持 No	Safari 不支持 No	WebView Android 不支持 No	Chrome Android 79	Firefox Android 不支持 No	Opera Android 不支持 No	Safari iOS 不支持 No	Samsung Internet Android 11.2
`requestSession()`	Chrome 79	Edge 79	Firefox 不支持 No	IE 不支持 No	Opera 不支持 No	Safari 不支持 No	WebView Android 不支持 No	Chrome Android 79	Firefox Android 不支持 No	Opera Android 不支持 No	Safari iOS 不支持 No	Samsung Internet Android 11.2

图例

完整支持
不支持
实验。期望将来行为有所改变。
使用非标名称。

元数据

最后修改： Feb 13, 2020

WebXR 设备 API
XRSystem
方法
1. XRSystem: isSessionSupported()
2. XRSystem: requestSession()
Related pages for WebXR Device API

在此页

特性

方法

事件

用法注意事项

范例

规范

浏览器兼容性

图例

相关话题