PushSubscription

Baseline 已广泛支持

此功能已成熟,并可在许多设备和浏览器版本上运行。自 2023 年 3 月以来,它已在各种浏览器中可用。

安全上下文: 此功能仅在安全上下文(HTTPS)中可用,且支持此功能的浏览器数量有限。

注意:此功能在 Web Workers 中可用。

PushSubscription 接口是 Push API 的一部分,它提供了一个订阅的 URL 端点,以及用于加密发送到此订阅的推送消息的公钥和密钥。这些信息必须通过任何您期望的应用特定的方法传递给应用程序服务器。

该接口还提供了有关订阅何时过期的信息,以及一个用于取消订阅的方法。

实例属性

PushSubscription.endpoint 只读

一个包含与推送订阅相关的端点的字符串。

PushSubscription.expirationTime 只读

如果存在,则为与推送订阅相关的订阅过期时间的 DOMHighResTimeStamp,否则为 null。

PushSubscription.options 只读

一个包含用于创建订阅的选项的对象。

PushSubscription.subscriptionId 已弃用 只读 非标准

一个包含与推送订阅相关的订阅 ID 的字符串。

实例方法

PushSubscription.getKey()

返回一个 ArrayBuffer,其中包含客户端的公钥,该公钥可以发送到服务器并用于加密推送消息数据。

PushSubscription.toJSON()

标准序列化器 — 返回订阅属性的 JSON 表示。

PushSubscription.unsubscribe()

启动从推送服务取消订阅的异步过程,并返回一个 Promise,该 Promise 在当前订阅成功注销时解析为一个布尔值。

描述

每个浏览器都使用一个特定的推送服务。服务工作线程可以使用 PushManager.subscribe() 来订阅支持的服务,并使用返回的 PushSubscription 来发现应该发送推送消息的端点。

PushSubscription 还用于获取应用程序服务器必须用来加密发送到推送服务的消息的公钥和密钥。请注意,用于解密推送消息的私钥不会被浏览器共享,并且在消息传递给服务工作线程之前用于解密消息。这确保了推送消息在通过推送服务器基础结构传输时保持私密。

服务工作线程除了将相关信息传递给应用程序服务器之外,不需要了解端点或加密的任何内容。可以使用任何机制与应用程序服务器共享这些信息。

示例

将编码信息发送到服务器

用于加密消息的 p256dh 公钥和 auth 密钥通过其推送订阅,使用 PushSubscription.getKey() 方法提供给服务工作线程,以及在 PushSubscription.endpoint 中发送推送消息的目标端点。用于加密的编码由 PushManager.supportedContentEncodings 静态属性提供。

此示例显示了如何将 PushSubscriptionsupportedContentEncodings 的所需信息放入 JSON 对象中,使用 JSON.stringify() 进行序列化,并将结果发布到应用程序服务器。

js
// Get a PushSubscription object
const pushSubscription =
  await serviceWorkerRegistration.pushManager.subscribe();

// Create an object containing the information needed by the app server
const subscriptionObject = {
  endpoint: pushSubscription.endpoint,
  keys: {
    p256dh: pushSubscription.getKey("p256dh"),
    auth: pushSubscription.getKey("auth"),
  },
  encoding: PushManager.supportedContentEncodings,
  /* other app-specific data, such as user identity */
};

// Stringify the object an post to the app server
fetch("https://example.com/push/", {
  method: "post",
  body: JSON.stringify(subscriptionObject),
});

从推送管理器取消订阅

js
navigator.serviceWorker.ready
  .then((reg) => reg.pushManager.getSubscription())
  .then((subscription) => subscription.unsubscribe())
  .then((successful) => {
    // You've successfully unsubscribed
  })
  .catch((e) => {
    // Unsubscribing failed
  });

规范

规范
推送 API
# pushsubscription-interface

浏览器兼容性

另见