Я пытаюсь выяснить, что произойдет, если у меня есть сервисный работник, зарегистрированный на живом сайте под названием sw.js
, а затем я переименую сервисного работника в service-worker.js
. Теперь старый не найден, но он все еще показывает старую кешированную версию.
Сколько времени нужно, чтобы зарегистрировать нового переименованного сервис-воркера или как это вообще работает?
Редактировать
Вот как я зарегистрировал сервис-воркера в приложении реакции:
componentDidMount() {
if ("serviceWorker" in navigator) {
navigator.serviceWorker
.register("/service-worker.js")
.then(registration => {
console.info("service worker registration successful: ", registration);
})
.catch(err => {
console.warn("service worker registration failed", err.message);
});
}
}
@Mathias, это сработает для меня, но я хочу, чтобы он обновился для всех
Хорошо, вы не собираетесь менять это часто, верно? Я предполагаю, что большинство людей этого не делают.
Не совсем, мне просто любопытно, как это изменить на живом сайте на всякий случай.
Вы должны обновить код создания экземпляра, чтобы отразить это изменение, в котором ваш общий воркер инициализируется и используется, например, ваш текущий код будет выглядеть как
var worker = new SharedWorker("ws.js");
Это нужно будет обновить до
var worker = new SharedWorker("service-worker.js");
Как бы вы это сделали в приложении reactjs? Я добавил код, который использую для регистрации ПО, но я никогда не использовал упомянутый вами SharedWorker
.
Где-то в вашем коде, который вы развертываете, есть "ws.js". Это нужно будет изменить на новое имя.
Это вопрос о ServiceWorkers, а не о WebWorkers.
Вновь созданный сервис-воркер (переименованный) не может заменить старый, потому что старый все еще активен и контролирует клиента. новый сервисный воркер (переименованный) будет ждать, пока существующий воркер не будет контролировать нулевых клиентов.
Теперь представьте, что сервис-воркер sw.js
установлен и активен (управляет клиентом),
Chrome визуализирует процесс для вас, как это
1. Сервисный работник зарегистрирован и активен
2. Теперь переименуем файл сервис-воркера в sw2.js
.
Вы можете видеть, что хром сообщает вам, что что-то изменилось в сервис-воркере. но текущий будет продолжать управлять клиентом, пока вы не заставите новый взять управление на себя, нажав кнопку skipWaitting
или очистив кеш. нажатие на кнопку приведет к тому, что sw2.js
возьмет на себя управление sw1.js
.
Теперь, если вам нужно сделать это программно, вы можете сделать это в событии install
внутри вашего сервис-воркера, вызвав self.skipWaiting()
.
self.addEventListener('install', (e) => {
let cache = caches.open(cacheName).then((c) => {
c.addAll([
// my files
]);
});
self.skipWaiting();
e.waitUntil(cache);
});
Следующий анимированное изображение из статьи Джейка Арчибальда Жизненный цикл обслуживающего работника может прояснить идею.
Я смог решить эту проблему, настроив сервер, который слушает запросы на получение как /service-worker.js
, так и /sw.js
.
Поскольку сервисный работник был переименован с sw.js
в service-worker.js
, он не мог найти старого сервисного работника в http://example.com/sw.js
, поэтому я сделал следующее:
createServer((req, res) => {
const parsedUrl = parse(req.url, true);
const { pathname } = parsedUrl;
// new service worker
if (pathname === "/service-worker.js") {
const filePath = join(__dirname, "..", pathname);
app.serveStatic(req, res, filePath);
// added new endpoint to fetch the new service worker but with the
// old path
} else if (pathname === "/sw.js") {
const filePath = join(__dirname, "..", "/service-worker.js");
app.serveStatic(req, res, filePath);
} else {
handle(req, res, parsedUrl);
}
}).listen(port, err => {
if (err) throw err;
console.info(`> Ready on http://localhost:${port}`);
});
Как видите, я добавил второй путь для обслуживания того же сервис-воркера, но с конечной точкой /sw.js
, один для старого sw.js
, а другой - для нового service-worker.js
.
Теперь, когда старые посетители, у которых есть старый активный sw.js
, загрузят более новый и при повторном посещении они автоматически получат более нового переименованного работника службы service-worker.js
.
Почему это не имеет смысла? Когда приходят старые посетители, старый сервисный воркер снова попытается получить старого сервисного воркера (sw.js
) и увидит изменения от нового сервисного воркера, который теперь будет обновлен, после обновления он будет извлекать из новой конечной точки новый сервис-работник.
Вы очистили кеш браузера?