ExtendableMessageEvent

Интерфейс ExtendableMessageEvent API рабочих потоков сервиса представляет собой объект события message, сгенерированного в рабочем потоке сервиса (когда сообщение получено в ServiceWorkerGlobalScope из другого контекста) — увеличивает срок жизни таких событий.

Этот интерфейс наследуется от интерфейса ExtendableEvent.

ExtendableMessageEvent()

Создаёт новый экземпляр объекта ExtendableMessageEvent.

Наследует свойства от родительского интерфейса ExtendableEvent.

ExtendableMessageEvent.data Только для чтения

Возвращает данные события. Они могут быть любого типа. Если отправлено в messageerror событии, свойство будет null.

ExtendableMessageEvent.origin Только для чтения

Возвращает источник Client, отправившего сообщение.

ExtendableMessageEvent.lastEventId Только для чтения

Представляет собой последний идентификатор события источника события в событиях, отправляемых по серверу.

ExtendableMessageEvent.source Только для чтения

Возвращает ссылку на объект Client, отправивший сообщение.

ExtendableMessageEvent.ports Только для чтения

Возвращает массив, содержащий объекты MessagePort, представляющие порты связанного канала сообщений.

Наследует методы от родительского интерфейса ExtendableEvent.

В примере ниже страница получает ссылку на объект ServiceWorker через ServiceWorkerRegistration.active, а затем вызывает его функцию postMessage().

// in the page being controlled
if (navigator.serviceWorker) {
  navigator.serviceWorker.register("service-worker.js");

  navigator.serviceWorker.addEventListener("message", (event) => {
    // event is a MessageEvent object
    console.log(`The service worker sent me a message: ${event.data}`);
  });

  navigator.serviceWorker.ready.then((registration) => {
    registration.active.postMessage("Hi service worker");
  });
}

Рабочий поток сервиса может получить сообщение, прослушивая событие message:

// in the service worker
addEventListener("message", (event) => {
  // event is an ExtendableMessageEvent object
  console.log(`The client sent me a message: ${event.data}`);

  event.source.postMessage("Hi client");
});

• Использование рабочих потоков сервиса
• Пример кода для рабочих потоков сервиса
• Отправка сообщений по каналу