通知。你能记住每天有多少网站或服务提示你授权它们发送通知吗？你能记得你上次收到通知时有多兴奋吗？

今年早些时候，我们决定减少人们在使用 Firefox 浏览器浏览网页时收到的未经请求的通知权限提示的数量。我们认为，这是 Mozilla 将用户利益放在首位的承诺的重要组成部分。

为此，我们进行了一系列研究和实验。我们希望了解如何改善用户体验，减少用户厌烦。作为回应，我们现在对网站请求用户授权发送通知的工作流程进行了一些更改。从 Firefox 72 开始，Firefox 将要求所有通知权限提示都需要显式用户交互。

有关背景故事，以及我们分析和实验的详细信息，请阅读 限制 Firefox 中的通知权限提示。今天，我们希望确保网络开发者了解即将发生的更改，并分享这两种关键场景的最佳实践

1. 如何引导用户前往提示。
2. 如何确认用户更改权限。

我们预计，一些网站会受到用户流程更改的影响。我们怀疑许多网站在他们的 UX 设计中尚未处理后者。让我们简要地浏览一下这两种场景

如何引导用户前往提示

理想情况下，希望获得授权向用户发送通知或提醒的网站已经引导他们完成了此过程。例如，他们会询问用户是否希望为该网站启用通知，并提供一个可点击的按钮。

document.getElementById("notifications-button").addEventListener("click", () => {
  Notification.requestPermission().then(setupNotifications);
});

从 Firefox 72 开始，通知权限提示将受到用户手势的限制。对于不遵循上述指南的网站，我们将不会代表它们发送提示。Firefox 将立即拒绝由 Notification.requestPermission() 和 PushManager.subscribe() 返回的承诺。但是，用户将在地址栏中看到一个小的通知权限图标。

请注意，由于 PushManager.subscribe() 需要一个 ServiceWorkerRegistration，因此 Firefox 将通过返回 ServiceWorkerRegistration 对象的承诺来传递用户交互标志。这使 常见的示例 能够在从事件处理程序调用时继续工作。

Firefox 在提示成功后显示通知权限图标。用户可以选择此图标来更改通知权限。例如，如果他们决定授予网站权限，或更改他们的偏好，不再接收通知。

如何确认用户更改权限

当用户通过通知权限图标更改通知权限时，这将通过 Permissions API 公开

navigator.permissions.query({ name: "notifications" }).then(status => {
  status.onchange = () => potentiallyUpdateNotificationPermission(status.state);
  potentiallyUpdateNotificationPermission(status.state);
}

我们相信这将改善用户体验，使其更加一致。并允许将网站界面与通知权限对齐。请注意，上述代码在 Firefox 的早期版本中也起作用。但是，用户不太可能在早期 Firefox 版本中动态更改通知权限。为什么？因为地址栏中没有通知权限图标。

我们的研究表明，用户更有可能参与他们显式交互的提示。我们已经看到，通过在用户界面中进行预提示，网站可以在呈现提示之前通知用户他们正在做出的选择。否则，在超过 99% 的情况下，未经请求的提示会被拒绝。

我们希望这些更改将为所有人带来更好的用户体验，以及与通知的更健康、更有效的互动。