Angular Service Worker-リソースの読み込みに失敗しました:サーバーがステータス504(ゲートウェイタイムアウト)で応答しました


83

私はアプリでAngular-CLI 1.6.6とを使用して@angular/service-worker 5.2.5いますAngular 5.2.5。本番環境で1つのエラーメッセージが表示されることを除いて、すべてがローカルのliteサーバーと本番サーバーで正常に機能します。

リソースのロードに失敗しました:サーバーはステータス504(ゲートウェイタイムアウト)で応答しました

探しているngsw-worker.jsエラーメッセージが上記生成される(以下2466)スクリプトIが発見行:

    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>

この質問に関連していると思われるエラー:「ServiceWorkerGlobalScope」で「fetch」の実行に失敗した原因:「only-if-cached」は「same-origin」モードエラーでのみ設定できますか?

このエラーを生成する要件は、アプリへの最初のアクセスです。

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

アプリのリロード時にエラーは繰り返されません。

誰かがここで私を助けてくれますか?safeFetch()Service Workerにバグがありますか(HashLocationStrategyをサポートするためかもしれません)?設定で何かを変更する必要がありますか?


9
多くの人がこの問題に直面しているようです。github.com/angular/angular/issues/20756 github.com/angular/angular/issues/20970など。それは役に立たないというわけではありませんが、Angular Service Workerプロジェクト(github.com)
sje 2018

1
完全なソースを提供してください(または、さらに良いことに、stackblitzをお願いします:)
yomateo 2018年

504を示す[ネットワーク]タブのスクリーンショットを提供できますか?
ダニエルハベニヒト2018年

2
この問題に関していくつかの作業が行われまし。@tobikこれはまだ問題ですか?
Joniras 2018

回答:


1

バックエンドからETagヘッダーを無効にすると、この問題が一時的に解決されました。


回答を詳しく教えていただけますか。AngularアプリケーションでこのETagを見つけることができます。
vndpal

バックエンド構成でそれを行う必要があります。
TibinThomas19年
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.