When I release a new version of my app I send a websocket event to my clients telling them that a new version is ready and they need to refresh their page to get the files.
I was hoping I could run something like this when receiving that websocket event:
for (const cacheKey of await caches.keys()) {
caches.delete(cacheKey)
}
However this only works if you have a serviceworker that is in charge of caching. I am using the simple cache-control header so this does not work for me.
My alternative strategy was to leave a flag in localstorage indicating that on the next load of the page, if the flag is there do a hard reload with:
window.location.reload(true)
This would do a double reload, the second time removing the flag and getting the new files.
the force download argument is ignored by modern browsers though.
It seems I can't get my clients to refresh without telling the users to manually erase their site settings (which is different on every device, iOS, Android, Chrome, Safari)
EDIT:
I looks like the only solution is to implement a service worker and manage my cache from there.
Any idea why location.reload(true) was deprecated? I know you can replicate it with a service worker with greater control - but SW feel like overkill for some use cases when a one liner is sufficient.