Как исключить кэширование страниц рабочего сервиса при использовании предварительного просмотра CMS (в iframe)
Я работаю над сайтом, на котором регистрируется сервисный работник, и он отлично работает, за исключением случаев редактирования страниц с помощью CMS. Сайт использует Craft CMS, которая имеет отличный вариант Live Preview для редактирования контента (в iframe). У работника сервиса возникают проблемы с сохранением и редактированием, поскольку страницы кэшируются, но я не уверен, как исключить область предварительного просмотра из кеша.
const version = 'V0.01';
const assetCacheName = version + 'assets';
const imageCacheName = 'images;';
const pagesCacheName = 'pages';
const cacheList = [
assetCacheName,
imageCacheName,
pagesCacheName
];
addEventListener('install', event => {
event.waitUntil(
caches.open(assetCacheName)
.then( assetCache => {
return assetCache.addAll([
'/assets/css/style.css',
'assets/js/min/scripts.min.js',
'offline.html'
]);
})
);
});
addEventListener('activate', event => {
event.waitUntil(
caches.keys()
.then( cacheNames => {
return Promise.all(
cacheNames.map( cacheName => {
if (!cacheList.includes(cacheName)) {
return caches.delete(cacheName);
}
})
);
})
.then( () => {
return clients.claim();
})
);
});
addEventListener('message', messageEvent => {
if (messageEvent.command == 'trimCaches') {
trimCache(pagesCacheName, 20);
trimCache(imageCacheName, 50);
}
});
addEventListener('fetch', event => {
const request = event.request;
if(request.headers.get('Accept').includes('text/html')) {
if(!/\/admin\/.+/.test(request.url)) {
console.log("this isn't an admin page");
event.respondWith(
caches.match(request)
.then( responseFromCache => {
if (responseFromCache) {
event.waitUntil(
fetch(request)
.then( responseFromFetch => {
caches.open(pagesCacheName)
.then( pagesCache => {
return pagesCache.put(request, responseFromFetch);
});
})
);
return responseFromCache;
}
return fetch(request)
.then( responseFromFetch => {
const copy = responseFromFetch.clone();
event.waitUntil(
caches.open(pagesCacheName)
.then( pagesCache => {
return pagesCache.put(request, copy);
})
);
return responseFromFetch;
})
.catch( error => {
return caches.match('/offline.html');
});
})
);
return;
}
}
if(request.headers.get('Accept').includes('image')) {
event.respondWith(
caches.match(request)
.then( responseFromCache => {
if (responseFromCache) {
event.waitUntil(
fetch(request)
.then( responseFromFetch => {
caches.open(imageCacheName)
.then( imageCache => {
return imageCache.put(request, responseFromFetch);
});
})
);
return responseFromCache;
}
return fetch(request)
.then( responseFromFetch => {
const copy = responseFromFetch.clone();
event.waitUntil(
caches.open(imageCacheName)
.then( imageCache => {
return imageCache.put(request, copy);
})
);
return responseFromFetch;
});
})
);
return;
}
event.respondWith(
caches.match(request)
.then( responseFromCache => {
if (responseFromCache) {
return responseFromCache;
}
return fetch(request);
})
);
});
function trimCache(cacheName, maxItems) {
cacheName.open( cache => {
cache.keys()
.then( items => {
if (items.length > maxItems) {
cache.delete(items[0])
.then(
trimCache(cacheName, maxItems)
);
}
});
});
}