CODEWITHSUNDEEP
angularservice-workerfont-awesome-5angular-service-worker
Sebastian Viereck
Sebastian Viereck

Reputation: 5877

Service Workers Angular load assets with version parameter in URL

I have an angular 6 app with an:

"@angular/pwa": "^0.6.0",
"@angular/service-worker": "^6",

I am getting a nice serivce worker, but me resources with an url GET parameter vor the version are not handled by the service worker in case of an offline situation:

GET 504 .../fontawesome-webfont.af7ae505a9eed503f8b8.woff2?v=4.7.0 
GET 504  .../fontawesome-webfont.fee66e712a8a08eef580.woff?v=4.7.0 
GET 504  .../fontawesome-webfont.b06871f281fee6b241d6.ttf?v=4.7.0

The path is correct!

These files are in the ngsw.json generated by the build command:

"/bordbuch_v2/frontend/fontawesome-webfont.674f50d287a8c48dc19b.eot",
"/bordbuch_v2/frontend/fontawesome-webfont.912ec66d7572ff821749.svg",
"/bordbuch_v2/frontend/fontawesome-webfont.af7ae505a9eed503f8b8.woff2",
"/bordbuch_v2/frontend/fontawesome-webfont.b06871f281fee6b241d6.ttf",
"/bordbuch_v2/frontend/fontawesome-webfont.fee66e712a8a08eef580.woff",

But I think the GET parameter is the problem. Does anybody know how I can stop font awesome from putting version parameters in the URL

OR

how I can make (angular) service workers to respond for files with a GET parameter?

Upvotes: 1

Views: 882

Answers (1)

Sebastian Viereck
Sebastian Viereck

Reputation: 5877

the solution was to add all files by this regex to the ngsw-config.json and unregister the old service worker and clear all caches:

{
  "index": "/index.html",
  "assetGroups": [{
    "name": "app",
    "installMode": "prefetch",
    "resources": {
      "files": [
        "/fontawesome-webfont*",
      ]
    }

Upvotes: 0

Related Questions