虽然一些 PWA 功能广为人知,例如可让 Web 应用接收和发布平台通知的 Notifications API,但还有许多新的和即将推出的功能将登陆 Web,让您的应用如虎添翼。Chromium Web Capabilities 项目(也称为 Project Fugu 🐡)旨在实现新的强大 Web 标准,同时保留 Web 的独特之处:以用户为中心的安全、低摩擦和跨平台兼容性。
弥合应用差距
这些功能大多旨在弥合传统桌面应用或移动应用与 Web 应用之间的差距,首批发布的主要功能包括:允许 Web 应用访问平台的联系人选择器和分享功能,以及允许已安装的 PWA 注册为平台分享目标和显示图标标记等等。
每项功能都经过广泛的标准化流程,以征求社区反馈意见,帮助完善 API 并确保最终设计安全、私密且值得信赖。新功能会在公开跟踪器中进行跟踪,并可分为以下五类之一:
-
已发货
-
可在最新稳定版 Chrome 中使用。只要正确检测到其使用情况,就可以可靠地使用。
-
在 Origin 试用版中
-
以 Chrome 源试用 (OT) 的形式提供,允许 Chrome 团队在实际使用中验证实验性功能和 API,并允许您就 API 的可用性和有效性提供反馈。OT 是选择启用的,可让您与用户一起对该功能进行 Beta 版测试,而无需用户在浏览器中切换任何特殊标志。API 可能会在 OT 之后发生变化,并且 OT 保证在发布前的一段时间内不可用,因此不应将其视为新 API 的早期发布机制。
-
在开发者试用版中
-
在 Chrome 中通过功能开关提供。这些 API 仍处于实验阶段,并且仍在积极开发中。它们不适合投入生产环境,很可能存在 bug,并且 API 会发生变化。虽然开发者可以利用这段时间自行试用实验性功能,但不应指示用户启用标志来使用其功能。
-
开通时间:
-
开发已开始,但目前尚无可用的 API。
-
正在考虑
-
用户表示感兴趣但尚未开始实现的 API。如果某个 API 尚未启动,请为其添加星标或在相应问题中添加您的使用情形,以帮助 Chromium 团队确定其优先级。
增强 PWA
在构建 PWA 时,请考虑实现以下 API 和最佳实践,以大幅提升 Web 应用的体验。按一般使用情形细分,您的应用可能会受益于一个或多个 API,从而提升整体用户体验。标记为 🔮 的 API 处于源试用阶段,标记为 🚩 的 API 处于开发者试用阶段,标记为 📱 的 API 目前在移动设备上处于稳定状态,并且桌面版实现已开始,提及的任何其他 API 均处于稳定状态(尽管可能并非在所有平台上都可用)。此列表仅包含 Chrome 当前稳定版、Beta 版(标记为 β)或 Canary 版(标记为 α)中提供的 API;此列表会定期更新,以反映已发布的 API。
应用安装
如果您希望 Web 应用与其他已安装的应用(例如任务栏、启动器、桌面和应用切换器中的应用)一起提供,请考虑实现以下 API,以便您的 PWA 可安装。也可以选择按照此 Codelab 中的说明操作。
- Web 应用清单 - 向浏览器和操作系统提供有关 Web 应用的信息,例如名称、徽标、启动应用的网址以及如何显示 Web 应用。
- Service Worker 和 Cache Storage API - 允许您的 Web 应用创建代理服务器并控制浏览器缓存的处理方式。可对浏览器的 fetch 事件做出反应,并且在离线时能够使用内容响应 Web 应用清单中指定的起始网址的 fetch 请求的 Service Worker 是可安装性的必要条件。
- 登录时运行 🚩Beta - 允许您将 PWA 配置为在用户登录时自动启动。
- 应用图标快捷方式 - 在受支持的平台上,通过已安装的应用图标的上下文菜单(即在移动设备上长按,在桌面设备上右键点击),提供指向 Web 应用中特定网址的快捷方式(例如,开始聊天、上传照片等)。
- getInstalledRelatedApps - 允许您的 Web 应用检查您的 PWA、Android 应用或 Windows (UWP) 应用是否已安装。
自适应且易于访问
如果您希望不同设备和不同身体和/或心理需求的用户都能使用您的 Web 应用,则应考虑实现以下功能:
- 自适应设计 - 确保您的 Web 应用在从小到大的各种屏幕尺寸下都能提供可用的(或至少不损坏的)体验,以便不同设备和窗口放置位置的用户都能使用您的应用。
- WCAG 2.0 指南 - 确保您的 Web 应用可供各种身体和心理能力的用户使用,而不仅仅是神经典型和身体健全的个人。另请参阅英国政府的无障碍设计注意事项。
创收和分发
- Web Payments - 灵活的标准在线支付界面,旨在适用于任何浏览器或设备,并与任何支付方式或支付服务提供商搭配使用。
- Digital Goods API 🔮 - 灵活的标准接口,用于从 Web 应用查询和管理应用内购买交易,包括支持常见购买类型,例如一次性购买、可重复购买(例如游戏内宝石/货币)和订阅。与 Web Payments 搭配使用。
- 可信 Web 活动 - 为您的 PWA 创建 Android 应用,以便在兼容的商店(例如 Google Play)中上架供用户下载。
剪贴板访问权限
- 异步剪贴板 - 读取和写入用户剪贴板中的文本和图片,并监听用户的复制和粘贴事件。
通知
如果您的 Web 应用需要通知用户(例如聊天应用或正在处理的后台编码),您可能需要考虑实现以下 API:
- 网页推送通知 - 用户选择启用后,允许您的 Web 应用向其推送通知。
- Badging API - 允许已安装的 Web 应用在应用图标上设置应用范围的标记(可选,可带数字)。
- 通知触发器 🔮 - 在满足触发条件(例如基于时间或位置的条件)时向用户发送通知(例如日历活动通知)
意向共享和协议处理
- 网址协议注册 🚩α - 使 Web 应用能够使用其安装清单将自己注册为自定义网址协议/方案的处理程序。
- Web Share - 在支持的设备上使用内置的系统分享界面,将网址、文本和文件分享到设备上安装的其他应用。您的应用无需安装。
- Web Share Target - 在受支持的设备上,让已安装的 PWA 在内置的系统分享界面中可用,以便用户能够从其他应用向您的应用分享文本和文件。
打开和保存文件
- 文件处理 API 🚩 - 让已安装的 Web 应用向操作系统注册其处理(读取/流式传输/编辑)具有给定 MIME 类型和/或文件扩展名的文件的能力,从而允许它们成为上下文菜单的“打开方式…”列表中的选项。
- File System Access API - 每次会话都可对用户的文件系统进行可靠的访问,从而实现以下互动(根据应用的需求)
- 从本地文件系统读取文件 - 显示文件选择器,并允许用户选择一个或多个(可选)要打开的文件,包括按 MIME 类型和扩展名限制允许的文件类型。
- 将更改保存到打开的文件 - 直接将更改保存到通过 FSA 打开的文件,而无需提示用户选择将文件保存到何处或让用户下载副本。
- 在本地文件系统上创建新文件 - 允许用户在本地文件系统上创建新文件(可以选择使用默认文件扩展名),然后您的应用可以访问该文件以进行保存。
- 最近打开的文件 - 使用 FSA 创建的文件句柄可以存储在 IndexedDB 中,以便您在用户会话之间显示最近使用的文件列表(不过编辑权限在会话之间仍然不会持久存在)
- 读取、写入和操作目录 - 允许用户在其本地文件系统上选择一个目录,然后您的应用可以读取该目录的内容,在该目录中创建、读取和删除文件和子目录,并确定相对文件路径。
- 压缩流 - 使用 gzip 和 deflate 压缩算法进行压缩或解压缩。
窗口管理
- 全屏 API - 允许用户让网页应用中的某个元素(例如视频)占据整个屏幕
- 跨屏幕窗口放置 API 🔮 - 允许 Web 应用获取有关已连接显示屏的信息,并相对于这些显示屏定位窗口,从而实现多窗口、多显示屏 Web 应用。
- 标签页式应用显示模式 🚩 - 允许已安装的网络应用显示在一个或多个标签页中,而不仅仅是在单个窗口中显示。
更深入的操作系统集成
- Local Fonts API 🔮 - 允许 Web 应用列出本地安装的字体,并请求低级别(面向字节)的 SFNT 容器访问权限,其中包括完整的字体数据,从而使应用能够自定义呈现本地安装的字体。
- 唤醒锁定 - 允许您的 Web 应用防止屏幕进入休眠状态,从而使您的 Web 应用能够执行长时间运行的任务,而不必担心中断(例如文件转码或在烹饪时保持菜谱显示)
- 空闲检测 🔮 - 允许您的 Web 应用检测用户何时未在积极使用其设备。
扩大了离线支持范围
如果您希望 Web 应用在离线状态下也能更好地运行,不妨考虑实现以下 API:
- 后台同步 - 在离线状态下,将需要连接的请求排入队列,然后在有网络连接时在后台同步 Web 应用的数据,而不是完全不处理离线请求。例如,允许在重新联网后发送消息或同步文档的增量更改。
- 定期后台同步 - 允许已安装且经常使用的 Web 应用根据经过的最短时间定期唤醒其服务工作线程并运行,例如更新缓存,以便在用户打开应用时内容是最新的。
- Content Indexing API - 让您的 Web 应用告知浏览器哪些内容可离线使用,以便浏览器向用户显示这些内容。
- 后台提取 - 允许长时间运行的后台提取操作,例如下载电影或上传视频和图片,而不会有服务工作线程被终止的风险。
媒体流式传输、编码和解码
如果您的 Web 应用会播放媒体文件(例如视频或音频文件),您可能需要考虑实现以下 API:
- 自适应流式传输 - 允许视频流根据网络性能在不同比特率之间切换
- 画中画 - 允许用户将视频从您的 Web 应用中弹出到始终位于顶部的窗口中,然后可以独立移动和调整该窗口的大小
- 媒体会话 API - 允许用户使用硬件和操作系统级软件功能(例如键盘或锁定屏幕上的播放/暂停/停止按钮)控制 Web 应用的媒体播放,以及控制操作系统级媒体通知(例如标题、艺术家、专辑和封面)
- Chromecast API - 允许用户将媒体投放到可用的 Chromecast 接收器,例如在电视上播放来自您的 Web 应用的视频。
- Web Codecs 🔮 - 访问内置的硬件和软件媒体编码器和解码器,可用于低延迟直播等实时用例,以及文件的编码、解码和转码。
扩展输入支持
- 指针事件 - 使用单个 API 响应触控、触控笔和鼠标事件,为用户提供更多输入选项。另请参阅有关触控友好型界面以及用户输入和控件的最佳实践。
- GamePad API - 允许您的 Web 应用响应来自常见游戏手柄的输入
- Web HID 🚩 - 允许您的 Web 应用访问非标准的人机接口设备(例如自定义控制器)
高级外围设备支持
PWA 核对清单
准备好开始使用这些强大的新 API 来增强 PWA 了吗?选择以下用例之一,查看推荐使用的一组 API;您也可以自行创建核对清单,然后努力完成它!