此页面由 Cloud Translation API 翻译。

现在可以跨浏览器使用推送通知

向用户提供及时且实用的通知。

Thomas Steiner

2016 年，随着 W3C 网站应用工作组发布推送 API 和通知 API，推送通知得到了标准化。这些 API 提供了必要的功能，可供 Web 开发者将推送通知集成到其 Web 应用中，并让用户在 Web 浏览器中接收通知并与通知互动。推送消息是指从用户之前已授权发送通知的网站或应用发送到用户网络浏览器的通知。这些消息可用于提醒用户有新内容或更新、提醒用户即将发生的活动或截止期限，或提供其他重要信息。对于需要向用户及时提供相关信息的应用（例如新闻或体育应用），或者希望向用户发送特惠或促销活动通知的电子商务网站，推送消息特别有用。

如需注册接收推送通知，请先检查浏览器是否支持推送通知，具体方法为检查 navigator 和 window 对象中的 serviceWorker 和 PushManager 对象。

如果支持推送通知，请使用 async 和 await 关键字注册 Service Worker 并订阅推送通知。以下示例展示了如何使用 JavaScript 执行此操作：

// Check if the browser supports push notifications.
if ("serviceWorker" in navigator && "PushManager" in window) {
  try {
    // Register the service worker.
    const swReg = await navigator.serviceWorker.register("/sw.js");

    // Subscribe for push notifications.
    const pushSubscription = await swReg.pushManager.subscribe({
      userVisibleOnly: true
    });

    // Save the push subscription to the database.
    savePushSubscription(pushSubscription);
  } catch (error) {
    // Handle errors.
    console.error("Error subscribing for push notifications.", error);
  }
} else {
  // Push notifications are not supported by the browser.
  console.error("Push notifications are not supported by the browser.");
}

浏览器支持

来源

现在可以跨浏览器使用推送通知

深入阅读