macOS 上 Web 应用的原生通知归因

Marijn Kruisselbrink
Marijn Kruisselbrink
LinkedIn
Dan Murphy
Dan Murphy
X LinkedIn

发布时间：2026 年 7 月 16 日

从 Chrome 152 开始，在 macOS 上安装的渐进式 Web 应用 (PWA) 的通知将以原生方式归因于 PWA 本身，而不是 Google Chrome。

这在用户体验方面是一项重大改进，让 Web 应用感觉与 macOS 的集成度更高。不过，这也对通知权限的处理方式以及某些通知 API 的行为方式做出了重要更改。

有何变化？

以前，PWA 发送的所有通知都在操作系统级层归因于 Chrome。在 macOS 通知中心内，这些通知会显示在“Google Chrome”下，并使用 Chrome 图标。如需停用通知，用户需要使用 Chrome 内的控件，而不是 macOS 系统设置。

借助通知归因，当网站作为 PWA 安装时，macOS 会将其视为一个单独的应用来处理通知。这适用于新安装的 PWA 以及用户之前安装的 PWA。

优点：

  • 品牌身份：通知会在 macOS 通知中心和横幅中显示 PWA 自己的名称和图标。
  • 用户熟悉的控件：这些应用的通知控件现在会显示在用户期望的位置：macOS 系统设置（而不是 Chrome）中。
  • 精细控制：用户可以管理各个 PWA 应用的通知 设置（例如提醒样式、锁定屏幕行为）。
  • 专注模式：可以在 macOS 专注模式 配置文件（勿扰模式）中单独允许或静音 PWA。
归因于“Google Chrome”，并带有 Chrome 图标。
之前： 归因于“Google Chrome”，并使用 Chrome 图标。
归因于“PWA 名称”，并显示 PWA 的自定义图标。
之后： 归因于“PWA 名称”，并使用 PWA 的自定义图标。

新的权限授予流程

由于 macOS 现在将 PWA 视为单独的应用，因此 PWA 必须先获得操作系统级层的通知权限 ，然后才能显示通知。这会更改新用户和现有用户的权限授予流程。

新用户（首次请求权限）

如果用户安装了 PWA，并且网站在安装后请求通知权限，则：

  1. Chrome 将跳过浏览器级层的权限提示 （地址栏中的下拉菜单）。
  2. Chrome 会立即触发 PWA 的 macOS 系统权限提示 。
macOS 系统权限对话框：“PWA 名称”想向您发送通知。通知可能包括提醒、声音和图标标记，并提供“不允许”和“允许”按钮。
已安装 PWA 的 macOS 系统权限对话框。
显示 PWA 权限流程的流程图。从“PWA 请求权限”开始，然后做出“已安装？”的决定。如果为“是”，则跳过 Chrome 提示，并显示 macOS 系统提示。如果为“否”，则显示 Chrome 浏览器提示，用户安装 PWA，然后显示 macOS 系统提示。
PWA 通知权限流程的流程图。

现有用户（迁移路径）

如果用户已在 Chrome 中向您的网站授予通知权限，然后安装（或已安装）PWA，则他们仍必须向 PWA 授予操作系统级层的权限。

为了尽可能顺利地完成此过渡，请执行以下操作：

  1. 当 PWA 首次尝试发送通知时，macOS 会显示系统权限提示。
  2. 如果用户批准，通知将继续无缝运行。
  3. 如果用户忽略或关闭此提示，PWA 将显示一个应用内指示器 （通常位于应用标题栏或菜单中），引导用户前往 macOS 系统设置以手动启用权限。
提示已安装的 PWA，让用户知道通知在 Mac 系统设置中已关闭，并提供一个按钮供用户前往该设置。
PWA 中的应用内提示，引导用户前往 macOS 系统设置。
应用设置，其中包含用于开启或关闭通知的选项，以及指向“系统设置”的指针，用于启用通知。
Chrome 中的应用设置，其中包含用于打开 macOS 系统设置的指示器。
提示浏览器内应用，告知用户通知在 Mac 系统设置中已关闭，并提供前往该设置的按钮。
浏览器内提示，引导用户前往 macOS 系统设置。

对开发者的影响：macOS 上已弃用 requireInteraction

在 macOS 上，通知是保留在屏幕上直到用户关闭它 (“持久” )，还是自动消失 (“临时” )，这是 macOS 系统设置中的 用户控制的按应用设置 。

由于此操作系统设计，Chrome 将不再遵循 requireInteraction选项在 macOS 上 Notification API 中当归因 处于活动状态时。

这对您的代码意味着什么：

如果您的应用依赖于 requireInteraction: true 来使重要通知保留在屏幕上，则在 macOS 上将不再保证这一点。相反，您应该：

  • 在设计应用时，假设通知可能是短暂的（临时 ）。
  • 鼓励需要持久通知的用户在 System Settings > Notifications > [Your PWA]中将 PWA 的 通知提醒样式配置为“持久”。
macOS 系统设置，突出显示了“提醒样式”设置，其中显示了“临时”和“持久”。
PWA 的 macOS 系统设置，显示了提醒样式设置（临时与持久）。

对开发者的影响：App Badging API 需要通知权限

借助 App Badging API ，Web 应用可以在其应用图标上设置标记（例如，显示 未读消息数）。在 macOS 上，应用图标标记在技术上与应用的通知设置相关联。由于 PWA 现在拥有自己的原生通知身份，因此：

  • 需要权限：PWA 必须启用操作系统级层的通知权限 ，标记才能显示在 Dock 图标上。这符合 macOS 平台标准，并且与 Safari 已经处理 Web 应用的 Badging API 的方式一致。
  • 静默失败：如果用户在 System Settings > Notifications > [Your PWA]中停用了“标记应用图标”，或完全拒绝了通知 权限，则对navigator.setAppBadge()的调用仍会在 JavaScript 中成功（不会抛出错误），但标记不会显示在 Dock 上。如果您的应用依赖于标记，请务必请求通知权限，以确保可以显示标记。

对企业管理的影响

对于管理 macOS 设备并希望预先授予通知权限的企业管理员：

  1. Chrome 政策：您仍必须配置 Chrome 政策 (NotificationsAllowedForUrls)，以向 PWA 的来源授予权限。
  2. macOS 政策：此外，您现在还必须部署 macOS 配置 文件 (MDM)，以向 PWA 的软件包 标识符（应用 shim）预先授予通知权限。

如果缺少这两项政策，系统仍会在操作系统级层提示用户。

开发者最佳实践

  1. 检查权限状态：在 发送通知之前，请务必检查 Notification.permission。
  2. 情境提示：如果您检测到在 Web 级层授予了权限，但未显示通知（如果操作系统级层 的权限被撤消，可能会发生这种情况），请引导用户前往 macOS 系统设置。
  3. 为临时通知做好准备：请勿依赖 requireInteraction 来实现 macOS 上的关键用户流程。