On a web page I have:
let response = await fetch(url, { cache: "no-store"});
Then in the service worker I have:
function handleFetch(event) {
console.log(event.request.cache) // Always prints 'reload', should be 'no-store'
}
self.addEventListener("fetch", handleFetch);
I require cache to be set to no-store not reload, i.e. the value it was set to. Chrome ignores the value and always changes it to reload. Am I doing something wrong or is this a case of Chrome inforcing its own value?
Further more to prove cache set correctly on the request I tried:
const init = { cache: "no-store"};
let request = new Request(url, init);
console.log(request.cache); // Prints 'no-store'
let request = new Request(url, init);
I think this is a Chrome bug: https://bugs.chromium.org/p/chromium/issues/detail?id=1317680
I guess I will just use a custom header or Cache-Control header until its sorted out.
From the MDN docs:
no-store — The browser fetches the resource from the remote server without first looking in the cache, and will not update the cache with the downloaded resource.
reload — The browser fetches the resource from the remote server without first looking in the cache, but then will update the cache with the downloaded resource.
https://developer.mozilla.org/en-US/docs/Web/API/Request/cache
So it seems that Chrome wishes to cache everything internally, because reasons, it might be some internal optimisation, and because of that supersedes your cache settings with their own, but respecting your wishes that you wish to have the "freshest data" by changing it to reload.
So you get the "newest uncached data", chrome gets to cache it for itself. Best of both worlds.