Is there a way to clear the service worker's cache at runtime in Angular 14?

410 Views Asked by At

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:

  1. 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).

  2. 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.

  3. 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!!

0

There are 0 best solutions below