Angular Service Worker - не удалось загрузить ресурс: сервер ответил статусом 504 (тайм-аут шлюза)

86

Я использую Angular-CLI 1.6.6и @angular/service-worker 5.2.5в нашем Angular 5.2.5приложении. Все работает нормально на локальном lite-сервере, а также на производственном сервере, за исключением одного сообщения об ошибке, появляющегося в нашей производственной среде:

Не удалось загрузить ресурс: сервер ответил статусом 504 (тайм-аут шлюза)

Заглянув в ngsw-worker.jsсценарий, я обнаружил следующие строки (2466), в которых генерируется сообщение об ошибке:

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

Ошибка ведения журнала консоли в перехвате выдает следующую ошибку:

    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>

Ошибка, которая, кажется, связана с этим вопросом: что вызывает Failed to execute 'fetch' on 'ServiceWorkerGlobalScope': 'only-if-cached' может быть установлено только с ошибкой режима 'same-origin'?

Запрос, который генерирует эту ошибку, - это любой первый доступ к приложению:

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

При перезагрузке приложения ошибка не повторяется.

Кто-нибудь может мне здесь помочь? Есть ли ошибка в safeFetch()сервис-воркере (возможно, для поддержки HashLocationStrategy)? Мне нужно что-то менять в моей конфигурации?

тобик
источник
9
Кажется, что многие люди сталкиваются с этой проблемой. github.com/angular/angular/issues/20756 github.com/angular/angular/issues/20970 и т. д. Не то чтобы это помогло, но похоже, что это рассматривается в соответствии с проектом angular service worker: github.com / angular / angular / projects / 13
sje 03
1
Пожалуйста, предоставьте ПОЛНЫЕ исходники (или еще лучше, stackblitz, пожалуйста :)
yomateo
Можете ли вы предоставить снимок экрана с вкладки сети, на котором показан 504?
Daniel Habenicht
2
Была проделана определенная работа по этому вопросу . @tobik, это все еще проблема?
Joniras
2
это ошибка хрома bugs.chromium.org/p/chromium/issues/detail?id=823392
Фатех Мохамед

Ответы:

1

Отключение заголовка ETag из бэкэнда временно решило эту проблему.

Тибин Томас
источник
Не могли бы вы уточнить свой ответ, где я могу найти этот ETag в приложении angular.
vndpal
Вы должны сделать это в конфигурации бэкенда.
Тибин Томас