WebXR 应用程序生命周期

在本指南中,我们将对创建和驱动 WebXR 应用所涉及的内容有一个概览,而不会深入到代码层面。这为 WebXR 指南后续的文章做准备,这些文章将涵盖 启动和关闭 WebXR 会话、几何模拟摄像头空间追踪 等内容。

生命周期概述

大多数使用 WebXR 的应用都会遵循类似的整体设计模式。

  1. 检查用户的设备和浏览器是否都能够提供您想提供的 XR 体验。

    1. 确保 WebXR API 可用;如果 navigator.xr 未定义,您可以假设用户的浏览器和/或设备不支持 WebXR。如果不支持,请禁用用于激活 XR 功能的任何用户界面,并中止任何进入 XR 模式的尝试。
    2. 调用 navigator.xr.isSessionSupported(),指定您想提供的 WebXR 体验模式:inlineimmersive-vrimmersive-ar,以确定您希望提供的会话类型是否可用。
    3. 如果您想使用的会话类型可用,请向用户提供适当的界面以允许他们激活它。
  2. 当用户通过与上面启用的用户界面交互来请求激活 WebXR 功能时,使用所需的模式请求一个 XRSession。这是通过调用 navigator.xr.requestSession() 来完成的,同样指定指示您想启用的模式的字符串:inlineimmersive-vrimmersive-ar

  3. 如果 requestSession() 返回的 Promise 解析,则使用新的 XRSession 在 WebXR 体验期间管理 WebXR 会话。这将涉及管理输入、动画和渲染。

    1. 调用 XRSession 方法 requestAnimationFrame() 来调度 XR 设备的第一个帧渲染。
    2. 如果您的场景很复杂,您应该考虑创建一个 Worker(或使用您之前为此目的创建的 Worker)来执行渲染每一帧所需的计算。这将减少渲染过程明显卡住应用的几率。
    3. 每个 requestAnimationFrame() 回调都应该使用关于 3D 世界中对象的信息来使用 WebGL 渲染帧。
    4. 每次调用回调时,它都应该再次调用 requestAnimationFrame(),以便让浏览器知道在渲染下一帧时需要再次运行回调。
  4. 当时间到来时(例如,当用户退出您的应用或离开您的网站时),结束 XR 会话;否则,继续循环直到用户选择退出 XR 模式。

    1. 要自己结束 XR 会话,请调用 XRSession.end()
    2. 包含一个 XRSession 事件 end 事件的处理器,以便在会话结束时收到通知,无论会话是您的代码、用户还是浏览器发起的终止。