Web technology reference for developers
Structure of content on the web
Code used to describe document style
General-purpose scripting language
Protocol for transmitting web resources
Interfaces for building web applications
Developing extensions for web browsers
Build web projects usable for all
Learn web development
Learn to structure web content with HTML
Learn to style content using CSS
Learn to run scripts in the browser
Learn to make the web accessible to all
A customized MDN experience
Get real-time assistance and support
All browser compatibility updates at a glance
Write, test and share your code
Интерфейс ServiceWorker, являющийся частью ServiceWorker API, позволяет взаимодействовать с Service Worker. К одному Service Worker могут быть привязаны несколько контекстов (например страниц, Web Workers, и т.д.), каждый с использованием собственного объекта ServiceWorker.
ServiceWorker
Объект ServiceWorker можно получить через свойства ServiceWorkerRegistration.active и ServiceWorkerContainer.controller — это Service Worker, который активировал и контролирует текущую страницу (в случае, если Service Worker был успешно зарегистрирован и страница была обновлена)
ServiceWorkerRegistration.active
ServiceWorkerContainer.controller
Интерфейс ServiceWorker обрабатывает события жизненного цикла: install и activate и функциональные события, например fetch. Объект ServiceWorker также содержит опцию ServiceWorker.state, отражающую его состояние.
install
activate
fetch
ServiceWorker.state
Интерфейс ServiceWorker наследует свойства Worker.
Worker
ServiceWorker.scriptURL
URL кода для данного Service Worker. URL должен находиться в том же домене, что и документ, регистрирующий ServiceWorker.
Состояние данного Service Worker. Может иметь следующие значения: installing, installed, activating, activated или redundant.
installing
installed,
activating
activated
redundant
ServiceWorker.onstatechange
Срабатывает при срабатывании события statechange; По сути, срабатывает при каждом изменении ServiceWorker.state.
statechange
Интерфейс ServiceWorker наследует все методы интерфейса Worker, кроме Worker.terminate, который не должен быть доступен для Service Worker.
Worker.terminate
Этот фрагмент кода из демо). Данный код возвращает значение ServiceWorker.state при каждом изменении состояния.
if ("serviceWorker" in navigator) { navigator.serviceWorker .register("service-worker.js", { scope: "./", }) .then(function (registration) { var 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", function (e) { / logState(e.target.state); }); } }) .catch(function (error) { / Произошла ошибка при регистрации Service Worker. / Файл service-worker.js может быть недоступным или содержать ошибки синтаксиса. }); } else { / Данный браузер не поддерживает Service Worker. }
Promises