Angular Service Worker - dataGroups not working

Question

I'm trying to use Angular Service Worker, everything works fine except the dataGroups not working for me.

That's what I have in my ngsw-config.json:

{
  ...
  "dataGroups": [
    {
      "name": "api-performance",
      "urls": [
        "/shipments/**"
      ],
      "cacheConfig": {
        "strategy": "performance",
        "maxSize": 100,
        "maxAge": "3d"
      }
    }
  ]
}

In my network tab I see that the service worker always make the server call then falls back to the cache. see attached image.

dataGroups - Performance

Notice the API I'm calling are on a different server, localhost vs some-server:8000, I tried different using different URLs: "/shipments/**" "/shipments" "http:some-server:8000/shipments/**" etc. but none worked.

My Environment:

• @angular 5.1.1
• Service-Worker 5.1.2
• Angular-Cli 1.6.0

Answer 1

I found a solution to this, my api and ui were not on the same server, after changing them on the same one, and updating the config to the code bellow, and using HTTPS on my site, everything worked perfectly:

"dataGroups": [
    {
      "name": "api-performance",
      "urls": [
        "/shipments"
      ],
      "cacheConfig": {
        "strategy": "performance",
        "maxSize": 100,
        "maxAge": "3d"
      }
    }
  ]