跳转到内容

ChromeOS 上的 PWA(启动器、置顶栏、文件处理)

发布于 更新于

一句话: 在 ChromeOS 上安装后,PWA 会出现在启动器中,与其他已安装应用并列,可以 被固定到置顶栏,并可以通过与其他桌面版 Chromium 平台相同的 Web App Manifest 与能力 API,接入操作系统级集成——带角标的应用图标、Web Share/Share Target,以及文件处理。

根据 Google 的 ChromeOS 开发者文档,一个可安装的 PWA 需要一份 Web App Manifest (提供名称、图标、起始 URL 与显示模式)以及一个用于离线支持的 Service Worker;安装 后它“会出现在启动器中,用户可以将其固定到置顶栏并快速访问”,与原生安装的应用并列。

安装后的角标、分享与文件处理

Section titled “安装后的角标、分享与文件处理”

根据 chromeos.dev,已安装的 ChromeOS PWA 可以使用若干能力 API,让体验更接近原生 应用:

  • 角标(Badging)。 根据 chromeos.dev,Badge API 会在应用的置顶栏图标上放置一个 小圆点作为视觉提示。
  • Web Share 与 Web Share Target。 PWA 既可以把内容分享给其他应用,也可以注册为 分享目标,让其他应用把链接、文本或文件分享进来。
  • 文件处理(File Handling)。 File Handling API 让 PWA 注册特定文件类型,使操作 系统可以用它“打开方式…”。
  • 应用快捷方式。 Manifest 中的 shortcuts 字段会在图标的右键菜单中添加条目, 用于快速访问特定的应用内操作。
async function shareToApps(data) {
if (!('share' in navigator)) {
return false; // Web Share 不受支持:改为显示应用自身的分享对话框。
}
await navigator.share(data);
return true;
}

根据 ChromeOS 开发者文档,各项 PWA 能力都按自己的节奏推出,“即便是 ChromeOS 上的 稳定支持,有时也可能是一个跨越数年的过程”——因此某项能力在 Windows/macOS/Linux 版 Chrome 上线,并不代表它会同时在 ChromeOS 上可用。

角标、分享与文件处理都是各自独立发布的能力,因此应分别检测,而不要假设“已安装在 ChromeOS 上”就意味着全部具备。根据 MDN,window.launchQueue 是应用接收用户打开 它时所用文件的方式:

async function setLauncherBadge(count) {
if (!('setAppBadge' in navigator)) {
return; // 此处不支持角标:没有启动器/置顶栏指示器可更新。
}
if (count > 0) {
await navigator.setAppBadge(count);
} else {
await navigator.clearAppBadge();
}
}
if ('launchQueue' in window) {
window.launchQueue.setConsumer((launchParams) => {
if (!launchParams.files.length) return;
handleOpenedFiles(launchParams.files);
});
} else {
// 不支持文件处理:回退到应用正常的应用内文件选择器/上传流程。
}
  • 提供完整的 Manifest(name、图标、start_url、display)——根据 Google 的 ChromeOS 文档,它决定了应用在启动器和置顶栏中的呈现方式。
  • 分别对 navigator.share、navigator.setAppBadge 与 window.launchQueue 做特性检测;每项能力都按自己的节奏推出并到达 ChromeOS。
  • 为检测发现缺失的每项能力提供可用的回退界面(应用内分享对话框、无角标、 正常的文件选择器),而不是留下一条死代码路径。
  • 为用户最常重复的操作声明 Manifest 的 shortcuts,安装后它们会直接出现在 图标的右键菜单中。
  • 在发布针对 ChromeOS 的具体说法前,先在真实的 ChromeOS 设备上验证安装后的行为—— 根据 ChromeOS 开发者文档,能力的可用性可能因平台而异。