Angular Service Worker - Failed to load resource: the server responded with a status of 504 (Gateway Timeout)
I am using the Angular-CLI 1.6.6
and @angular/service-worker 5.2.5
in our Angular 5.2.5
app. Everything works fine on the local lite-server, as well as on the production server, except for one error message popping in our production environment:
Failed to load resource: the server responded with a status of 504 (Gateway Timeout)
Looking into the ngsw-worker.js
script I found the lines (2466 following) where the error message above is generated:
async safeFetch(req) {
try {
return await this.scope.fetch(req);
}
catch (err) {
this.debugger.log(err, `Driver.fetch(${req.url})`);
return this.adapter.newResponse(null, {
status: 504,
statusText: 'Gateway Timeout',
});
}
}
Console logging err in the catch puts out the following error:
TypeError: Failed to execute 'fetch' on 'ServiceWorkerGlobalScope': 'only-if-cached' can be set only with 'same-origin' mode
at Driver.safeFetch (ngsw-worker.js:2464)
at Driver.handleFetch (ngsw-worker.js:1954)
at <anonymous>
An error that seems related to this question: What causes a Failed to execute 'fetch' on 'ServiceWorkerGlobalScope': 'only-if-cached' can be set only with 'same-origin' mode error?
The req that generates this error is any first access to the app:
https://example.com/test/#/connect
https://example.com/test/#/map?token=[accestoken]
...
On app reload the error is not repeated.
Can anybody help me out here? Is there a bug in safeFetch()
of the service worker (maybe to support HashLocationStrategy)? Do I have to change anything in my config?
Disabling ETag header from backend solved this issue temporarily.