Я бы только отправил вам комментарий, но модераторы выгнали друга, так как он некоторое время не заходил сюда, что просто отняло у меня немного репутации, чтобы я не комментировал. Хватит жаловаться ...
Просто хотел сообщить, что вы должны подумать, какие ресурсы вы кэшируете с сервисным работником. Вам необходимо реализовать политику управления кэшем, которая лучше всего подходит для создаваемого вами приложения.
Кроме того, каждый раз, когда ваш сервисный работник устанавливает новую версию, это не обязательно означает, что вы запускаете с новым кешем, кеш может управляться независимо от вариантов сервисного работника. Я бы порекомендовал вам начать использовать версионный кеш и сервисный работник. Таким образом, вы сможете лучше контролировать ситуацию. Кеш определенно стабилен.
Чтобы проверить, какие ресурсы вы в настоящий момент кэшировали для Chrome, перейдите по ссылке:
Инструменты разработчика (Ctrl + Shift + I) -> Приложение (вкладка) -> Кэш -> Хранилище кеша (разверните это из бокового меню), вы должны увидеть «имя вашего кеша (ов)», как только вы выберете «кеш» имя интереса "-" v2 "вы должны точно видеть, какие ресурсы вы кэшировали в тот самый момент, когда вы просматриваете его.
Кроме того, старайтесь кэшировать только те ресурсы, которые вы контролируете. Т.е. не от третьих лиц, так как могут возникнуть некоторые вопросы, требующие изучения. Помните, что если ваш сервисный работник не контролирует сторонние ресурсы, вы не можете ожидать, что он сможет их обработать. У работника службы ниже его текущего местоположения находится имя домена, в котором оно было размещено.
Если вы хотите постоянно добавлять ресурсы, которые находятся в пределах контроля вашего сервисного работника, до выпуска новой версии сервисного работника, вы можете использовать что-то вроде этого:
self.addEventListener('fetch', event => {
if (event.request.method === 'GET') { //only bother for static resources ;)
switch (0) {
case event.request.url.indexOf('https://www.google-analytics.com'):
case event.request.url.indexOf('https://www.googletagmanager.com'):
// skip adding to cache
// console.warn('skip adding to cache ' + event.request.method + ' ' + event.request.mode + ' ' + event.request.url);
break;
case event.request.url.indexOf(SERVER_URL):
// Cache falling back to network
// console.info('[PWA] The service worker is serving an asset. ' + event.request.method + ' ' + event.request.mode + ' ' + event.request.url);
event.respondWith(
caches.open(CACHE_NAME).then((cache) => {
return cache.match(event.request).then((response) => {
return response || fetch(event.request).then((response) => {
if (response.status === 200) {
cache.put(event.request, response.clone());
return response;
} else if (response.type === 'opaqueredirect' || response.status === 404) {
return response;
} else {
return cache.match('offline.html');
}
}).catch(() => {
return cache.match('offline.html');
});
});
})
);
break;
default:
// console.warn('new case for cache ' + event.request.method + ' ' + event.request.mode + ' ' + event.request.url);
}
}
});
В этом примере вы бы кэшировали «offline.html» при установке программного обеспечения, чтобы вы могли отображать его, когда пользователь пытается получить доступ к ресурсам в автономном режиме, а ресурс ранее не кэшировался. Этот метод может быть описан как «обслуживать кеш или брать ресурсы из сети, а затем обслуживать из кеша». Вам также потребуется реализовать логику для обрезки / замены / обновления кеша статических ресурсов посредством выпуска новых вариантов сервисного работника и выполнения этой логики по мере необходимости.
ура!