Oculus Quest 2 是一款虚拟现实 (VR) 头戴设备，由 Meta 旗下 Oculus 公司开发。开发者现在可以构建和分发 2D 和 3D 渐进式 Web 应用 (PWA)，从而充分利用 Oculus Quest 2 的多任务处理功能。
Oculus 任务 2
Oculus Quest 2 是一款由 Meta 旗下 Oculus 开发的虚拟现实 (VR) 头戴设备。它是该公司上一款头戴设备 Oculus Quest 的继任产品。该设备既可作为具有内部 Android 操作系统的独立耳机运行，也可作为在桌面设备上运行的与 Oculus 兼容的 VR 软件（通过 USB 或 Wi-Fi 连接时）。它在具有 6 GB RAM 的芯片上使用 Qualcomm Snapdragon XR2 系统。Quest 2 的显示屏是一个单一的快速切换 LCD 面板，每只眼睛的分辨率为 1,832 × 1,920 像素，刷新率高达 120 Hz。
Oculus 浏览器
目前有三种浏览器可用于 Oculus Quest 2：Wolvic（是 Firefox Reality 的继任产品）和内置的 Oculus 浏览器。本文重点介绍后者。Oculus 网站介绍 Oculus 浏览器，具体如下所述。
“Oculus 浏览器支持最新的网络标准和其他技术，可帮助您在网络上打造 VR 体验。目前的 2D 网站在 Oculus 浏览器中运行良好，因为它由 Chromium 渲染引擎提供支持。它针对 Oculus 头戴设备进一步优化，以获得最佳性能，并让 Web 开发者能够通过 WebXR 等新 API 充分发挥 VR 的潜力。通过 WebXR，我们打开了通往网络下一个前沿的大门。”
用户代理
撰写本文时，浏览器的用户代理字符串如下所示。
Mozilla/5.0 (X11; Linux x86_64; Quest 2)
AppleWebKit/537.36 (KHTML, like Gecko)
OculusBrowser/18.1.0.2.46.337441587
SamsungBrowser/4.0
Chrome/95.0.4638.74
VR
Safari/537.36
如您所见，Oculus 浏览器的当前版本 18.1.0.2.46.337441587 基于 Chrome 95.0.4638.74，仅比当前 Chrome 稳定版（即 96.0.4664.110）落后一个版本。如果用户切换到移动模式，VR 会更改为 Mobile VR。
界面
浏览器的界面（如上所示）具有以下功能（顶行从左到右排列）：
- “返回”按钮
- 名为重新加载的按钮
- 网站信息
- 网址栏
- “创建书签”按钮
- 提供“窄”“中”和“宽”选项以及缩放功能用于调整大小的按钮
- “请求访问移动网站”按钮
- 包含以下选项的菜单按钮：
- 进入私密模式
- 关闭所有标签
- 设置
- 书签
- 下载内容
- 历史记录
- 清除浏览数据
最下面一行包括以下功能：
- “关闭”按钮
- “最小化”按钮
- 包含后退、前进和重新加载选项的三点状按钮
刷新率和设备像素比
对于 Oculus Quest 2，Oculus 浏览器以 90 Hz 刷新率渲染 2D 网页内容和 WebXR。观看全屏媒体时，Oculus 浏览器会根据视频的帧速率优化设备刷新率，例如 24 fps。Oculus Quest 2 的设备像素比为 1.5，文字清晰明了。
Oculus 浏览器和 Oculus Store 中的 PWA
2021 年 10 月 28 日，Meta (Oculus) 产品管理主管 Jacob Rossi表示 Oculus Quest 和 Oculus Quest 2 将引入 PWA。下文将介绍 Oculus 上的 PWA 体验，并说明如何在 Oculus Quest 2 中构建、旁加载和测试 PWA。
状态共享
登录状态会在 Oculus 浏览器和 PWA 之间共享，从而允许用户在这两者之间无缝切换。当然，Facebook 登录功能开箱就受支持。Oculus 浏览器包含一个密码管理器，可让用户在浏览器和已安装的应用之间安全地存储和共享密码。
PWA 窗口大小
用户可以自由调整浏览器窗口和已安装 PWA 的窗口大小。高度介于 625 像素到 1200 像素之间。宽度可以设置在 400 像素到 2,000 像素之间。 默认尺寸为 1,000 × 625 像素。
与 PWA 交互
PWA 可以通过 Oculus 左右控制器、蓝牙鼠标和键盘以及手部跟踪功能进行控制。滚动方式是通过 Oculus 控制器上的拇指操纵杆，或者通过双指张合和食指向所需方向移动。用户可通过双指张合来选择要选择的内容。
PWA 的权限
Oculus 浏览器中的权限的工作方式与 Chrome 中几乎相同。该状态会在浏览器中运行的应用和已安装的 PWA 之间共享，因此用户可以在两种体验之间切换，而无需再次授予相同的权限。
尽管实现的是许多权限，但并非所有功能都受支持。例如，虽然请求地理定位权限成功，但设备从未实际获得位置信息。同样，各种硬件 API（如 WebHID、Web Bluetooth 等）均通过功能检测，但实际上不会显示可让用户将 Oculus 与硬件设备配对的选择器。我想，一旦浏览器成熟，API 的功能可检测性就会改进。
通过 Chrome 开发者工具调试 PWA
启用开发者模式后，在 Oculus Quest 2 上调试 PWA 的方式与远程调试 Android 设备中所述的完全相同。
- 在 Oculus 设备上，在 Oculus 浏览器中浏览到所需的网站。
- 在计算机上启动 Google Chrome，然后前往
chrome://inspect/#devices。 - 找到相关 Oculus 设备，设备后面是该设备上当前打开的一组 Oculus 浏览器标签页。
- 在所需的 Oculus 浏览器标签页上点击inspect。
应用发现
用户可以使用浏览器本身或 Oculus Store 来发现 PWA。与任何其他浏览器一样，安装的 PWA 也可以在 Oculus 浏览器中作为在标签页中运行的网站运行。当用户访问某个网站时，当（且仅当）Oculus 商店中有应用时，Oculus 浏览器才会帮助用户发现该应用。对于已安装此应用的用户，Oculus 浏览器可帮助他们根据需要轻松切换到该应用。
Oculus Quest 2 中的示例 PWA
Meta 的 PWA
多个 Meta 部门为 Oculus Quest 2 创建了 PWA，例如 Instagram 和 Facebook。这些 PWA 在没有网址栏且可以自由调整大小的独立应用窗口中运行。
其他开发者开发的 PWA
在撰写本文时，Oculus 商店上的 Oculus Quest 2 的 PWA 数量很少，但正在增长。Spike 让用户可以在 Spike 应用的虚拟环境中心内从收件箱体验电子邮件、聊天、通话、记事、任务和待办事项等所有基本工作工具。
另一个例子是 Smartsheet，它是一个动态工作区，可提供项目管理、自动化工作流和快速构建新解决方案。
更多 PWA（例如 Slack、Dropbox 或 Canva）即将发布，正如在 2021 年 Facebook Connect 大会上发布的有关 Jacob Rossi 的视频所预告的那样。
为 Oculus 创建 PWA
Meta 在其文档中概述了所需的步骤。一般来说，可在 Chrome 中安装的 PWA 通常应该可以在 Oculus 上即开即用。
Web 应用清单要求
与 Chrome 的可安装性标准和 Web 应用清单规范相比，它们之间存在一些重大差异。例如，Oculus 目前仅支持从左到右书写的语言，而 Web 应用清单规范不强制执行此类限制。另一个示例是 start_url，Chrome 严格要求应用可安装，但在 Oculus 上则不强制要求安装。Oculus 提供了一个命令行工具，可让开发者为 Oculus Quest 2 创建 PWA，以便他们传递 Web 应用清单中缺失的参数（或替换现有参数）。
Oculus 具有许多可选的专有 Web 应用清单字段，可用于自定义 PWA 体验。
使用对话泡 CLI 打包 PWA
Bubblewrap 是一组开源库和一个适用于 Node.js 的命令行工具 (CLI)。气泡封装功能由 Google Chrome 团队开发，旨在帮助开发者生成和构建 Android 项目，并为其签名，从而将您的 PWA 作为可信网络活动 (TWA) 启动。
Meta Quest Browser 目前不完全支持 TWA，但从版本 1.18.0 开始，对话泡支持为 Meta Quest 设备打包 PWA。
它可以生成用于在常规 Android 设备上打开 TWA 的通用 APK 文件，并在 Meta Quest 设备上打开 Meta Quest 浏览器。
假设您安装了 Node.js，可以使用以下命令安装 Bubblewrap CLI：
npm i -g @bubblewrap/cli
首次运行 Bubblewrap 时，它会提供自动下载并安装所需的外部依赖项 - Java Development Kit (JDK) 和 Android SDK Build Tools。
如需生成与 Meta Quest 兼容的 Android 项目来封装 PWA，请运行带有 --metaquest 标志的 init 命令，然后按照向导进行操作：
bubblewrap init --manifest="https://your.web.app/manifest.json" --metaquest
生成项目后，运行以下命令进行构建和签名：
bubblewrap build
这将输出一个名为 app-release-signed.apk 的文件。此文件可以安装在设备上，也可以发布到 Meta Quest 商店、Google Play 商店或任何其他 Android 应用分发平台。
将 PWA 与 Oculus 平台实用程序打包
Oculus Platform Utility 是 Meta 开发的官方命令行工具，用于发布适用于 Oculus Rift 和 Meta Quest 设备的应用。
此外，它还允许使用 create-pwa 命令为 Meta Quest 设备打包 PWA，并将其发布到 Meta Quest 商店和 App Lab。
通过 -o 参数设置输出文件名，并通过 --android-sdk 参数设置指向 Android SDK 的路径。
通过 --web-manifest-url 参数将该工具指向 Web 应用清单的实际网址。
如果实时 PWA 上没有清单，或者想要替换实时清单，您仍然可以使用本地清单文件和 --manifest-content-file 参数为 PWA 生成 APK。
如需让清单尽可能保持纯净，请使用 --package-name 参数并提供采用反向域名表示法的值（例如 com.company.app.pwa），而不是在清单中添加专有的 ovr_package_name 字段。
ovr-platform-util create-pwa -o output.apk --android-sdk ~/bin/android-10 --manifest-content-file manifest.json --package-name com.company.app.pwa
使用 PWABuilder 打包 PWA
作者认为使用 PWABuilder 是为 Meta Quest 打包 PWA 的最简单方法，因此建议您使用。
PWABuilder 是由 Microsoft 开发的开源项目，可让开发者打包其 PWA 并为其签名，以发布到各种商店，包括 Microsoft 商店、Google Play 商店、App Store 和 Meta Quest Store。
只需输入 PWA 的网址，输入/修改应用的元数据，然后点击 Generate 按钮，即可使用 PWABuilder 打包 PWA。
PWABuilder 允许开发者选择在后台使用什么工具为 Meta Quest 设备打包 PWA。
您可以选择 Meta Quest 选项来使用 Oculus Platform Utility。
您可以选择 Android 选项来使用对话泡，然后选中 Meta Questcompatible 复选框。
使用 adb 安装 PWA
创建 APK 文件后，您可以使用 ADB 通过 USB 或 Wi-Fi 将其旁加载到 Meta Quest 设备：
adb install app-release-signed.apk
如果您使用 Bubblewrap CLI 打包 PWA，它可以提供便捷的别名命令来旁加载 APK 文件：
bubblewrap install
旁加载的应用会显示在应用抽屉的未知来源部分。
应用提交
Oculus 开发者中心文档详细介绍了如何上传 PWA 并将其提交到 Oculus 商店。
除了将应用提交到 Oculus Store 之外，开发者还可以通过 SideQuest 等平台安全可靠地将应用分发给消费者，而无需获得商店批准。这样，即使应用处于早期开发阶段、处于实验阶段或仅以特定受众群体为目标受众群体，他们也可以直接将应用提供给最终用户。
测试多标签页应用
为了测试多标签页应用，我创建了一个小小的测试 PWA 来演示各种链接功能：即打开新的 PWA 内标签页、停留在当前标签页、打开新的浏览器窗口，以及在 WebView 中打开并保持当前标签页。在您的机器上运行以下命令，创建此应用的本地安装副本。
ovr-platform-util create-pwa -o test.apk --android-skd ~/bin/android-10 --web-manifest-url https://tomayac.github.io/oculus-pwa-test/manifest.json --package-name com.example.pwa
adb install test.apk
以下是测试应用的屏幕截图。
Oculus 版本的 SVGcode
为了快速了解相关说明，我创建了 Oculus 版本的最新 PWA，即 SVGcode。您可以从我的 Google 云端硬盘下载生成的 APK 文件 output.apk。如果您想进一步调查软件包，我还有一个反编译版本。在 package.json 中找到构建说明。
您可以在 Oculus 上使用该应用，包括打开和保存文件的功能。Oculus 浏览器不支持 File System Access API，但回退方法会有所帮助。唯一不起作用的功能是双指张合缩放。我原本希望按下两个控制器上的触发器按钮，然后反向移动控制器，它才能正常运行。除此之外，正如您在嵌入的抓屏中看到的，所有其他性能都非常出色，响应迅速。
沉浸式 3D WebXR PWA
Oculus Quest 的 PWA 支持不限于平面 2D 应用。开发者可以使用 WebXR API 为 VR 打造沉浸式 3D 体验。
想知道如何在 VR 中处理各种提示（PWA 安装、权限请求、通知）？
以下是沉浸式 Web 工作组的 WebXR Tests 的用户代理提示测试的抓屏。
如您所见，进入 VR 模式需要用户的许可。系统会针对每个源请求一次权限。请求权限会退出沉浸模式。目前不支持通知。
手部追踪
得益于 WebXR Hand Input API 和 Meta 基于 AI 的手部跟踪系统，您可以在沉浸模式下用手与 PWA 互动。
这是 Immersive Web 工作组的 WebXR 示例中的手部跟踪示例抓屏。
增强/混合现实（直通式）
如 Meta Connect 2022 上所宣布的那样，Meta Quest 浏览器在 Meta Quest 2 和 Meta Quest Pro 设备上新增了对 WebXR 增强现实 (AR)（也称为混合现实 [MR]）的支持。
我们来看一个略微修改的 A-Frame 起始示例，其中包含缩小的模型以及用于增强现实的隐藏天空和平面。
A-Frame 是一个开源 Web 框架，用于完全通过易于阅读、理解以及复制和粘贴的声明性、可重复使用的自定义 HTML 元素构建 3D/VR/AR 体验。
这是 Meta Quest 2 上这个演示的抓屏。
Meta Quest 2 配有单色摄像头，因此直通模式采用灰度模式，而 Meta Quest Pro 有彩色摄像头。
总结
Oculus Quest 2 中的 PWA 非常有趣，前景也很有前景。无边无际的虚拟画布可让用户缩放屏幕，以适应当前任务，这极有可能改变我们未来的工作方式。虽然使用手部跟踪功能在 VR 中输入内容仍处于起步阶段，至少对我而言，该功能还不能非常可靠地运行，但对于输入网址或输入简短文本来说效果不错。
在 Oculus Quest 2 中，我最喜欢 PWA 的是它们只是常规 PWA，可以在浏览器标签页中原封不动地使用，也可以通过精简 APK 封装容器而不使用任何平台专用 API。使用同一代码定位多个平台从未如此简单。那就是 Web 版 VR 和 AR 中的 PWA未来是光明的！
致谢
Oculus Quest 2 照片由 Maximilian Prandstätter 在 Flickr 上拍摄。Oculus 存储 Instagram、Facebook、Oculus Browser 和 Spike 应用的图片，以及由 Meta 提供的应用可检测性插图和手部跟踪动画。主打图片由 Arnau Marín i Puig 提供。此帖子由 Joe Medley 审核。