I have a problem with the pwa of my website. I need to update the cache memory with the service worker and I find many codes on the internet but none works. I have to miss something.
I wish that after a simple reload of the page the update is done, likewise when we click on the shortcut of the PWA that everything is updated automatically. Here is my manifest and my service worker with the code I use.
What do you think ?
thank you in advance
//Manifest -----
{
"name": "Test",
"short_name": "Test",
"lang": "en",
"start_url": "./index.html",
"display": "standalone",
"background_color": "white",
"theme_color": "white",
"icons": [{
"src": "/img/icon-128.png",
"sizes": "128x128",
"type": "image/png"
}, {
"src": "/img/icon-144.png",
"sizes": "144x144",
"type": "image/png"
}, {
"src": "/img/icon-152.png",
"sizes": "152x152",
"type": "image/png"
}, {
"src": "/img/icon-192.png",
"sizes": "192x192",
"type": "image/png"
}, {
"src": "/img/icon-256.png",
"sizes": "256x256",
"type": "image/png"
}, {
"src": "/img/icon-512.png",
"sizes": "512x512",
"type": "image/png"
}]
}
//Service-Worker -----
var cacheName = 'Test';
var filesToCache = [
'/',
'/index.html',
'/css/style.css',
...
];
/* Start the service worker and cache all of the app's content */
self.addEventListener('install', function(e) {
e.waitUntil(
caches.open(cacheName).then(function(cache) {
return cache.addAll(filesToCache);
})
);
});
/* Serve cached content when offline */
self.addEventListener('fetch', function(e) {
e.respondWith(
caches.match(e.request).then(function(response) {
return response || fetch(e.request);
})
);
});
self.addEventListener('activate', function(event) {
var cacheKeeplist = ['cacheName'];
event.waitUntil(
caches.keys().then(function(keyList) {
return Promise.all(keyList.map(function(key) {
if (cacheKeeplist.indexOf(key) === -1) {
return caches.delete(key);
}
}));
})
);
});
Aucun commentaire:
Enregistrer un commentaire