Для future ссылки:
1 / Создать файл рабочего сервиса в папке приложения root .
Пример sw.js :
let cacheName = "core" // Whatever name
// Pass all assets here, this example use the root folder «core»
let filesToCache = [
"/",
"/index.html",
"/core/app.css",
"/core/main.js",
"/core/otherlib.js",
"/core/favicon.ico"
]
self.addEventListener("install", function(e) {
e.waitUntil(
caches.open(cacheName).then(function(cache) {
return cache.addAll(filesToCache)
})
)
})
self.addEventListener("fetch", function(e) {
e.respondWith(
caches.match(e.request).then(function(response) {
return response || fetch(e.request)
})
)
})
2 / Добавить событие onload в любом месте приложения:
window.onload = () => {
"use strict";
if ("serviceWorker" in navigator && document.URL.split(":")[0] !== "file") {
navigator.serviceWorker.register("./sw.js");
}
}
3 / Создать manifest.json файл в папке приложения root .
{
"name": "APP",
"short_name": "App",
"lang": "en-US",
"start_url": "/index.html",
"display": "standalone"
}
4 / Тестовый пример.Запустите веб-сервер из папки root :
php -S localhost:8090
Посетите http://localhost:8090 один раз.
Остановите веб-сервер с помощью Ctrl + c.
Обновить http://localhost:8090, страница должна ответить.
Чтобы отключить при разработке, удалите событие onload,и в Firefox посетите about:debugging#workers
, чтобы отменить регистрацию службы.
Источник для получения более подробной информации
Manifest.json ссылка