ServiceWorker

Интерфейс ServiceWorker API Service Worker предоставляет ссылку на сервис-воркер. Несколько контекстов просмотра (например, страницы, рабочие процессы и т. д.) могут быть связаны с одним сервис-воркером, каждый через уникальный объект ServiceWorker.

Объект ServiceWorker доступен через ряд свойств:

• ServiceWorkerRegistration.active
• ServiceWorkerGlobalScope.serviceWorker
• ServiceWorkerContainer.controller — когда сервис-воркер находится в состоянии activating или activated
• ServiceWorkerRegistration.installing — когда сервис-воркер находится в состоянии installing
• ServiceWorkerRegistration.waiting — когда сервис-воркер находится в состоянии installed

Свойство ServiceWorker.state и событие statechanged могут быть использованы для проверки и наблюдения за изменениями в жизненном цикле связанного с объектом сервис-воркера. Связанные события жизненного цикла, такие как install и activate генерируются самим сервис-воркером.

Сервис-воркеры позволяют статически импортировать модули ECMAScript, если поддерживается, с помощью import. Динамический импорт запрещен спецификацией — вызов import() приведет к ошибке.

Сервис-воркеры могут быть зарегистрированы только в области Window в некоторых или во всех браузерах, так как объект ServiceWorker не доступен для DedicatedWorkerGlobalScope и SharedWorkerGlobalScope. Проверьте совместимость браузеров для получения информации.

Интерфейс ServiceWorker наследует свойства от своего родителя, EventTarget.

ServiceWorker.scriptURL Только для чтения

Возвращает сериализованный URL-адрес скрипта ServiceWorker, определенный как часть ServiceWorkerRegistration. URL-адрес должен быть на том же происхождении, что и документ, который регистрирует ServiceWorker.

ServiceWorker.state Только для чтения

Возвращает состояние сервис-воркера. Возвращает одно из следующих значений: parsed, installing, installed, activating, activated, или redundant.

Интерфейс ServiceWorker наследует методы от своего родителя, EventTarget.

ServiceWorker.postMessage()

Отправляет сообщение — состоящее из любого структурированного клонируемого объекта JavaScript — в сервис-воркер. Сообщение передается сервис-воркеру с помощью события message в его глобальной области.

statechange

Срабатывает при изменении ServiceWorker.state.

error

Срабатывает при возникновении ошибки внутри объекта ServiceWorker.

Этот фрагмент кода взят из примера регистрации сервис-воркера (живая демонстрация). Код прослушивает любые изменения в ServiceWorker.state и возвращает его значение.

if ("serviceWorker" in navigator) {
  navigator.serviceWorker
    .register("service-worker.js", {
      scope: "./",
    })
    .then((registration) => {
      let serviceWorker;
      if (registration.installing) {
        serviceWorker = registration.installing;
        document.querySelector("#kind").textContent = "installing";
      } else if (registration.waiting) {
        serviceWorker = registration.waiting;
        document.querySelector("#kind").textContent = "waiting";
      } else if (registration.active) {
        serviceWorker = registration.active;
        document.querySelector("#kind").textContent = "active";
      }
      if (serviceWorker) {
        // logState(serviceWorker.state);
        serviceWorker.addEventListener("statechange", (e) => {
          // logState(e.target.state);
        });
      }
    })
    .catch((error) => {
      // Something went wrong during registration. The service-worker.js file
      // might be unavailable or contain a syntax error.
    });
} else {
  // The current browser doesn't support service workers.
  // Perhaps it is too old or we are not in a Secure Context.
}

• Руководство по офлайн-приложениям (сервис-воркеры)
• Использование сервис-воркеров
• Базовый пример кода сервис-воркера
• Использование веб-воркеров