因此,我有一个包含服务工作者的超文本标记语言页面,服务工作者缓存index.html和我的JS文件。
问题是,当我更改JS时,更改不会直接显示在客户端浏览器上。当然,在chrome dev-tools中,我可以禁用缓存。但是在chrome mobile中,我该怎么做呢?
我尝试访问站点设置,然后点击了清除% RESET按钮。但它仍然从缓存加载旧的页面/加载。我尝试使用其他浏览器或chrome隐身,它会加载新页面。
然后,我尝试清除我的浏览数据(只是缓存),它工作了。
我想这不应该是这样的,对吧?如果不清除chrome浏览器缓存,我的用户将不会知道页面是否已更新。
发布于 2017-08-03 03:00:49
使用此命令删除过期的缓存:
self.addEventListener('activate', function(event) {
event.waitUntil(
caches.keys().then(function(cacheNames) {
return Promise.all(
cacheNames.filter(function(cacheName) {
// Return true if you want to remove this cache,
// but remember that caches are shared across
// the whole origin
}).map(function(cacheName) {
return caches.delete(cacheName);
})
);
})
);
});
发布于 2017-10-06 11:03:38
如果您知道缓存名称,您可以简单地从worker中喜欢的任何位置调用caches.delete()
:
caches.delete(/*name*/);
如果你想擦除所有缓存(而不是等待它们,假设这是一个后台任务),你只需要add this
caches.keys().then(function(names) {
for (let name of names)
caches.delete(name);
});
发布于 2021-03-18 06:39:42
最优雅的解决方案,具有异步/等待功能:
const cacheName = 'v2';
self.addEventListener('activate', event => {
// Remove old caches
event.waitUntil(
(async () => {
const keys = await caches.keys();
return keys.map(async (cache) => {
if(cache !== cacheName) {
console.log('Service Worker: Removing old cache: '+cache);
return await caches.delete(cache);
}
})
})()
)
})
https://stackoverflow.com/questions/45467842
复制相似问题