Chrome 中的桌面通知如何工作？

Chrome 桌面通知解释

现代浏览器中的桌面通知可以在屏幕上显示简单的消息。当您想要提醒或通知用户，即使他们没有与您的网站交互时，它们特别有用。

有两种类型的通知：

桌面通知：

• 易于显示
• 几秒后自动消失
• 仅在网页打开时可用

Service Worker 通知：

• 实现起来更复杂
• 可以持久存在，即使网页关闭时也会出现
• 支持操作按钮

访问桌面通知 API：

桌面通知 API 对这两种类型使用类似的参数，如 MDN 上所述。要访问此 API：

1. 请求页面加载权限。
2. 创建一个带有标题、图标和正文文本的新通知对象。
3. 分配一个事件监听器来处理操作（onclick）。

示例实现：

<code class="js">document.addEventListener('DOMContentLoaded', function() {
  if (!Notification) alert('Desktop notifications not available in your browser.');
  if (Notification.permission !== 'granted') Notification.requestPermission();
});

function notifyMe() {
  if (Notification.permission === 'granted') {
    var notification = new Notification('Notification title', {
      icon: 'icon.png',
      body: 'Hey there! You\'ve been notified!',
    });
    notification.onclick = function() {
      window.open('http://example.com');
    };
  } else Notification.requestPermission();
}</code>

HTML：

<code class="html"><button onclick="notifyMe()">Notify me!</button></code>

以上是Chrome 中的桌面通知如何工作？的详细内容。更多信息请关注PHP中文网其他相关文章！