ServiceWorkerGlobalScope: событие pushsubscriptionchange

Событие pushsubscriptionchange отправляется в глобальную область ServiceWorker для указания изменения подписки на push, произошедшего вне контроля приложения.

Это может произойти, если подписка была обновлена браузером, но также может произойти, если подписка была аннулирована или потеряна.

Это событие не может быть отменено и не всплывает.

Используйте имя события в методах, таких как addEventListener(), или задайте свойство обработчика события.

addEventListener("pushsubscriptionchange", (event) => {});

onpushsubscriptionchange = (event) => {};

Общее Event.

Хотя примеры, демонстрирующие, как делиться информацией о подписке с сервером приложения, часто используют fetch(), это не обязательно лучший выбор для реального использования, так как он не будет работать, например, если приложение находится в автономном режиме.

Рассмотрите возможность использования другого метода для синхронизации информации о подписке между вашим сервис-воркером и сервером приложения или убедитесь, что ваш код, использующий fetch() достаточно устойчив к ситуациям, когда попытки обмена данными терпят неудачу.

В этом примере, выполняемом в контексте сервис-воркера, подключается обработчик события pushsubscriptionchange и повторно подписывается на истекшую подписку.

self.addEventListener(
  "pushsubscriptionchange",
  (event) => {
    const conv = (val) =>
      self.btoa(String.fromCharCode.apply(null, new Uint8Array(val)));
    const getPayload = (subscription) => ({
      endpoint: subscription.endpoint,
      publicKey: conv(subscription.getKey("p256dh")),
      authToken: conv(subscription.getKey("auth")),
    });

    const subscription = self.registration.pushManager
      .subscribe(event.oldSubscription.options)
      .then((subscription) =>
        fetch("register", {
          method: "post",
          headers: {
            "Content-type": "application/json",
          },
          body: JSON.stringify({
            old: getPayload(event.oldSubscription),
            new: getPayload(subscription),
          }),
        }),
      );
    event.waitUntil(subscription);
  },
  false,
);

Когда событие pushsubscriptionchange поступает, указывая, что подписка истекла, мы повторно подписываемся, вызывая метод subscribe() менеджера push. Когда полученная promise разрешается, мы получаем новую подписку. Она передаётся на сервер приложения с помощью вызова fetch() для отправки представленного в формате JSON значения endpoint подписки на сервер приложения.

Вы также можете использовать свойство обработчика событий onpushsubscriptionchange для настройки обработчика события:

self.onpushsubscriptionchange = (event) => {
  event.waitUntil(
    self.registration.pushManager
      .subscribe(event.oldSubscription.options)
      .then((subscription) => {
        /* ... */
      }),
  );
};

• Использование API Push