在渐进式Web应用程序中，Service Worker未自动更新
在渐进式Web应用程序中，Service Worker未自动更新
提问于 2016-09-06 13:55:51
当我在service worker中更改一些代码时，我希望在浏览器中更新以前的service worker。我已经读到，service-worker.js中的任何更改都会在浏览器中自动刷新它。这是我的service worker代码：
var dataCacheName = 'demo-v5';
var filesToCache = [
'/',
'/Home/Index',
'/Home/AboutUs'
];
self.addEventListener('install', function (e) {
console.log('[Service Worker] Install');
e.waitUntil(
caches.open(dataCacheName).then(function (cache) {
console.log('[Service Worker] Caching app shell');
return cache.addAll(filesToCache);
})
);
});
self.addEventListener('activate', function(e) {
console.log('[ServiceWorker] Activated');
caches.keys()
e.waitUntil(
// Get all the cache keys (cacheName)
caches.keys().then(function(cacheNames) {
return Promise.all(cacheNames.map(function(thisCacheName) {
// If a cached item is saved under a previous cacheName
if (thisCacheName !== dataCacheName) {
// Delete that cached file
console.log('[ServiceWorker] Removing Cached Files from Cache - ', thisCacheName);
return caches.delete(thisCacheName);
}
else
{
console.log('Else- ', thisCacheName);
}
}));
})
); // end e.waitUntil
// return self.clients.claim();
});
self.addEventListener('fetch', function (e) {
console.log('[Service Worker] Fetch', e.request.url);
var dataUrl = 'https://query.yahooapis.com/v1/public/yql';
if (e.request.url.indexOf(dataUrl) > -1) {
e.respondWith(
caches.open(dataCacheName).then(function (cache) {
return fetch(e.request).then(function (response) {
cache.put(e.request.url, response.clone());
return response;
});
})
);
} else {
e.respondWith(
caches.match(e.request).then(function (response) {
return response || fetch(e.request);
})
);
}
});回答 2
Stack Overflow用户
发布于 2016-09-08 20:58:38
感谢您的回复。实际问题与filesToCache.The根目录有关，即"/“
var filesToCache = [
// '/',
'/Home/Index',
'/Home/AboutUs'
];应该在这里注解。我的服务工作者类也被缓存了，每次刷新后它都会从缓存中提取它。
Stack Overflow用户
发布于 2016-09-06 15:07:50
服务工作线程中的更改将反映在页面的第二次刷新中。如果它甚至在第二次刷新时都没有更新，那么在Chrome开发人员控制台中查找服务工作者错误(我希望你已经在使用它)。它将会在
Applications ->服务工作进程
在chrome开发者工具(最新稳定的Chrome版本)中。
单击Ctrl + Shift + I或Right click -> Inspect Element打开Chrome开发人员工具。
注意：如果您希望服务工作者在第一次刷新时更新，则将安装事件更改为-
self.addEventListener('install', function (e) {
console.log('[Service Worker] Install');
e.waitUntil(
caches.open(dataCacheName).then(function (cache) {
console.log('[Service Worker] Caching app shell');
return cache.addAll(filesToCache);
}).then(function(e){
return self.skipWaiting();
})
);
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/39341538
复制相关文章
相似问题
腾讯云开发者
