WebXR 填充库

这是WebXR设备API和WebXR游戏手柄模块的JavaScript实现。这个填充库允许开发者基于最新规范编写代码，在支持WebVR 1.1规范的浏览器或完全不支持WebVR/WebXR的移动设备上提供支持。

该填充库反映了已在多个浏览器中发布的API稳定版本。

如果你正在基于WebVR 1.1规范编写代码，请使用webvr-polyfill，它支持实现1.0规范的浏览器或完全没有实现的浏览器。然而，建议你针对WebXR设备API规范编写代码，并在浏览器开始实现最新变更时使用此填充库。

WebXR当前支持的最小输入控制也在这里进行了填充，使用游戏手柄API。

设置

安装

下载build/webxr-polyfill.js构建文件并作为脚本标签引入，或使用CDN。你也可以在同一位置使用名为webxr-polyfill.min.js的压缩文件。

  <script src='webxr-polyfill.js'></script>
  <!-- 或使用CDN链接 -->
  <script src='https://cdn.jsdelivr.net/npm/webxr-polyfill@latest/build/webxr-polyfill.js'></script>

如果你使用browserify或webpack等构建工具，可以通过npm安装。

$ npm install --save webxr-polyfill

本地构建

$ npm run build

使用

webxr-polyfill暴露了一个单一的构造函数WebXRPolyfill，它接受一个配置对象。完整的配置选项请参见API。

确保在调用任何XR代码之前实例化填充库！如果API不存在，填充库需要对其进行补丁，这样你的内容代码就可以假设WebXR API可以正常工作。

如果使用脚本标签，将存在一个全局的WebXRPolyfill构造函数。

var polyfill = new WebXRPolyfill();

在模块化的ES6环境中，类似地导入并实例化构造函数。

import WebXRPolyfill from 'webxr-polyfill';
const polyfill = new WebXRPolyfill();

API

new WebXRPolyfill(config)

接受一个带有以下选项的config对象：

global：应该用于查找所需类型的全局对象。（默认值：浏览器上的window）
webvr：是否应尝试回退到WebVR 1.1 VRDisplay。（默认值：true）
cardboard：是否应仅在移动设备上尝试回退到WebXR API的JavaScript实现。（默认值：true）
cardboardConfig：使用CardboardVRDisplay时要使用的配置。当cardboard为false或使用其他XRDevice时无效。可能的配置选项可以在cardboard-vr-display仓库的这里找到。（默认值：null）
allowCardboardOnDesktop：是否允许在桌面上通过传感器使用Cardboard的立体渲染和姿态。这很可能只对开发和调试有帮助。（默认值：false）

浏览器支持

开发注意事项：babel支持目前已移除，在#63中明确处理 提供了3个构建版本：build/webxr-polyfill.js，一个ES5转译构建版本，其压缩对应版本build/webxr-polyfill.min.js，以及一个未转译的ES模块版本build/webxr-polyfill.module.js。如果使用转译后的ES5构建版本，开发者需要根据其支持情况决定要填充哪些浏览器特性，因为没有包含额外的polyfill。此库使用的一些浏览器特性包括：

TypedArrays
Object.assign
Promise
Symbol
Map
Array#includes

检查.babelrc配置，并确保polyfill能在你选择支持的任何浏览器中运行。

Polyfill规则

如果'xr' in navigator === false：
- WebXR类（如XRDevice、XRSession）将被添加到全局作用域
- navigator.xr将被填充
- 如果平台有来自WebVR 1.1规范的可用VRDisplay：
  - navigator.xr.requestDevice()将返回一个包装VRDisplay的填充XRDevice
- 如果平台没有VRDisplay，config.cardboard === true，且在移动设备上：
  - navigator.xr.requestDevice()将返回一个基于CardboardVRDisplay的填充XRDevice
- 如果WebGLRenderingContext.prototype.setCompatibleXRDevice不是函数：
  - 填充所有WebGLRenderingContext.prototype.setCompatibleXRDevice和一个用于{ compatibleXrDevice }的创建属性
  - 填充HTMLCanvasElement.prototype.getContext以支持xrpresent类型。返回一个填充的XRPresentationContext（通过CanvasRenderingContext2D或ImageBitmapRenderingContext（如果支持））用于镜像和魔窗
如果'xr' in navigator === true，config.cardboard === true且在移动设备上：
- 重写navigator.xr.requestDevice，以便如果存在原生XRDevice则返回它，否则返回基于CardboardVRDisplay的填充XRDevice