网站有新的重要新闻发布时，提醒用户有新内容

业务要求：当网站有新的重要新闻发布时，我们需要向用户发送通知，提醒用户有新内容。

实现

js 复制代码

if ("Notification" in window) {
  Notification.requestPermission().then(permission => {
    if (permission === "granted") {
      new Notification("Title", {
        body: "Notification message",
        icon: "path/to/icon.png"
      });
    }
  });
}

解析

检查浏览器是否支持通知功能，并在支持的情况下请求用户授予通知权限，若用户授予了权限，则创建并显示一个浏览器通知。以下是对代码的详细解释：

检查浏览器是否支持通知功能：

javascript

javascript 复制代码

if ("Notification" in window) {

"Notification" in window 这一条件表达式用于检查当前浏览器的 window 对象中是否存在 Notification 属性。如果存在，则说明浏览器支持使用通知功能；如果不存在，则说明不支持，代码块内的后续操作将不会执行。

请求通知权限：

javascript

ini 复制代码

Notification.requestPermission().then(permission => {

Notification.requestPermission() 是一个方法，它会弹出一个系统对话框，请求用户授予网页发送通知的权限。该方法返回一个 Promise，在用户做出选择（允许、拒绝或阻止）后，Promise 会被解决，并将用户的选择（"granted"、"denied" 或 "default"）作为参数传递给 then 回调函数。

处理权限授予情况：

javascript

ini 复制代码

if (permission === "granted") {

在 then 回调函数中，通过判断 permission 的值是否为 "granted" 来确定用户是否授予了通知权限。如果是 "granted"，则表示用户允许网页发送通知。

创建并显示通知：

javascript

arduino 复制代码

new Notification("Title", {
  body: "Notification message",
  icon: "path/to/icon.png"
});

如果用户授予了通知权限，代码会创建一个新的 Notification 对象。Notification 构造函数接受两个参数：第一个参数是通知的标题（这里是 "Title"）；第二个参数是一个配置对象，包含通知的详细信息，如 body（通知的正文内容，这里是 "Notification message"）和 icon（通知图标的路径，这里是 "path/to/icon.png"）。创建 Notification 对象后，浏览器会显示相应的通知。