I am using service worker to cache lookups in my Angular 14 PWA application and everything is working fine. However, the admin in the application has the permission to add/remove lookups options which is causing me the issue.
Upon changing the lookups, the service worker keeps fetching the old data (which is expected). Here's my SW configuration:
"dataGroups": [
{
"name": "lookups",
"urls": [
"/hqccc_incident/v1/lookups**"
],
"cacheConfig": {
"maxSize": 15,
"maxAge": "15d",
"strategy": "performance"
}
}]
My goal is to be able to fetch the updated lookups from the server after the user modifies the options.
Here are the solutions I tried:
Clear the cache at runtime, but the SW keeps serving old data (even if the cache in the browser is empty) until I close and reopen the tab (and sometimes it does not work).
Stop/restart the SW from the application tab in the developer tool, it works perfectly, but I was not able to stop/restart the SW programmatically.
Using hard refresh, but after closing the tab and reopening it, the SW will serve old data.
Is there any way to do it ?
Please note that I do not want to use freshness as a strategy.
Any help is much appreciated!!