PushManager: метод subscribe()

Базовая версия 2023

Новое

С марта 2023 года эта функция работает на последних версиях устройств и браузеров. Возможно, эта функция не будет работать на более старых устройствах или браузерах.

Безопасный контекст: Эта функция доступна только в безопасных контекстах (HTTPS) в некоторых или во всех поддерживающих браузерах.

Примечание: Эта функция доступна в Web Workers.

Метод subscribe() интерфейса PushManager подписывается на сервис push-уведомлений.

Он возвращает Promise, который разрешается в объект PushSubscription содержащий подробности подписки на push-уведомления. Новая подписка на push-уведомления создается, если в текущем service worker отсутствует существующая подписка.

Синтаксис

subscribe(options)

Параметры

options Необязательно

Объект, содержащий необязательные параметры конфигурации. Он может иметь следующие свойства:

userVisibleOnly: Булево значение, указывающее, что возвращаемая подписка на push-уведомления будет использоваться только для сообщений, эффект которых становится видимым для пользователя.
applicationServerKey: Строка Base64 или ArrayBuffer, содержащая открытый ключ ECDSA P-256, который сервер push-уведомлений будет использовать для аутентификации вашего сервера приложения. Если указано, все сообщения с вашего сервера приложения должны использовать схему аутентификации VAPID и содержать JWT, подписанный соответствующим закрытым ключом. Этот ключ НЕ является тем же ключом ECDH, который вы используете для шифрования данных. Дополнительную информацию см. в разделе «Использование VAPID с WebPush».

Примечание: Этот параметр требуется в некоторых браузерах, таких как Chrome и Edge. Они отклонят обещание, если userVisibleOnly не установлено в true.

Возвращаемое значение

A Promise, разрешающий объект PushSubscription.

Примеры

this.onpush = (event) => {
  console.log(event.data);
  // From here we can write the data to IndexedDB, send it to any open
  // windows, display a notification, etc.
};

navigator.serviceWorker.register("serviceworker.js");

// Use serviceWorker.ready to ensure that you can subscribe for push
navigator.serviceWorker.ready.then((serviceWorkerRegistration) => {
  const options = {
    userVisibleOnly: true,
    applicationServerKey,
  };
  serviceWorkerRegistration.pushManager.subscribe(options).then(
    (pushSubscription) => {
      console.log(pushSubscription.endpoint);
      // The push subscription details needed by the application
      // server are now available, and can be sent to it using,
      // for example, the fetch() API.
    },
    (error) => {
      // During development it often helps to log errors to the
      // console. In a production environment it might make sense to
      // also report information about errors back to the
      // application server.
      console.error(error);
    },
  );
});

Обработка жестов пользователя

Вызовы subscribe() должны выполняться в ответ на жест пользователя, например, нажатие кнопки:

btn.addEventListener("click", () => {
  serviceWorkerRegistration.pushManager
    .subscribe(options)
    .then((pushSubscription) => {
      // handle subscription
    });
});

Это не только лучшая практика — вы не должны спамить пользователей уведомлениями, на которые они не соглашались — но и в будущем браузеры будут запрещать уведомления, не инициированные в ответ на жест пользователя. Например, Firefox уже делает это начиная с версии 72.

Спецификации

Спецификация
Push API # dom-pushmanager-subscribe

Совместимость с браузерами

	Рабочий стол					Мобильный
	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox для Android	Opera Android	Safari в iOS	Samsung Internet	WebView Android
`subscribe`	42 Параметр `options` с значением `applicationServerKey` требуется.	17 Параметр `options` с значением `applicationServerKey` требуется.	44 Начиная с Firefox 72, может вызываться только в ответ на жест пользователя, такой как событие `click`.	29	16 Уведомления поддерживаются в macOS Ventura и более поздних версиях.	42 Параметр `options` со значением `applicationServerKey` требуется.	48 Начиная с Firefox Android 79, может вызываться только в ответ на жест пользователя, такой как событие `click`.	29 Параметр `options` со значением `applicationServerKey` требуется.	16.4 Уведомления поддерживаются в веб-приложениях, сохранённых на главном экране.	4.0 Параметр `options` со значением `applicationServerKey` требуется.	Нет

© 2005–2024 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/PushManager/subscribe