88 votes

Angular Service Worker - Impossible de charger une ressource : le serveur a répondu avec un statut de 504 (Gateway Timeout)

J'utilise le Angular-CLI 1.6.6 y @angular/service-worker 5.2.5 dans notre Angular 5.2.5 app. Tout fonctionne bien sur le serveur local lite, ainsi que sur le serveur de production, à l'exception d'un message d'erreur qui apparaît dans notre environnement de production :

Impossible de charger la ressource : le serveur a répondu avec un statut de 504 (délai d'attente de la passerelle)

Regarder dans le ngsw-worker.js script J'ai trouvé les lignes (2466 suivantes) où le message d'erreur ci-dessus est généré :

    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',
            });
        }
    } 

L'erreur de consignation de la console dans la capture affiche l'erreur suivante :

    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>

Une erreur qui semble liée à cette question : Quelle est la cause de l'erreur Failed to execute 'fetch' on 'ServiceWorkerGlobalScope' : 'only-if-cached' can be set only with 'same-origin' mode ?

La req qui génère cette erreur est tout premier accès à l'application :

https://example.com/test/#/connect
https://example.com/test/#/map?token=[accestoken]
...

Lors du rechargement de l'application, l'erreur ne se répète pas.

Quelqu'un peut-il m'aider ? Y a-t-il un bug dans safeFetch() du travailleur de service (peut-être pour supporter HashLocationStrategy) ? Dois-je changer quelque chose dans ma configuration ?

9 votes

Il semble que beaucoup de personnes soient confrontées à ce problème. github.com/angular/angular/issues/20756 github.com/angular/angular/issues/20970 etc. Non pas que cela soit d'une quelconque utilité, mais il semble que cela soit étudié dans le cadre du projet angular service worker : github.com/angular/angular/projects/13

1 votes

Veuillez fournir des sources COMPLETES (ou mieux encore, stackblitz s'il vous plaît :)

0 votes

Pouvez-vous fournir une capture d'écran de l'onglet réseau, qui montre le 504 ?

2voto

Tibin Thomas Points 134

La désactivation de l'en-tête ETag depuis le backend a résolu ce problème temporairement.

1 votes

Pouvez-vous s'il vous plaît élaborer votre réponse, où puis-je trouver cet ETag dans une application angulaire.

0 votes

Vous devez le faire dans la configuration du backend.

0 votes

Ça ne marche pas pour moi.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X