問題タブ [service-worker-events]

下の画像でわかるように、Service Worker は両方ともアクティブであり、フェッチしているファイルは Service Worker のスコープ内にありますが、fetch イベントはまだ発生していません。

Service Worker がフェッチをインターセプトするために必要な条件は他にありますか?

Service Worker を追加して app-shell をキャッシュする前に、Web ページに関連するファイル (main.css、app.js、shims.js など) に対する発信要求がブラウザーによってキャッシュされていました。これにより、これらのファイルに対するそれ以降のリクエストは、タイムスタンプ付きのリクエストを含む、キャッシュされたバージョンを返しました (また、max-age が期限切れになった場合、これらのリクエストは Etag で検証されます)。(この動作は、ページの通常の訪問中も同じです。)

ここで、Web ページ (PWA) が初めてコンテンツを要求します。コンテンツが受信された後、サービス ワーカーのインストール イベントは、バックグラウンドで指定されたファイルのフェッチを開始します。

それらの一部はブラウザー キャッシュ (ディスク/メモリ キャッシュ) から取得されますが、一部は再度ダウンロードされます (de.json、en.json、app.js、shims.js、main.css)。attacehd イメージを参照してください。これらすべての URI には、リクエストが Web ページから実行されたときのタイムスタンプが含まれていますが、その後のリクエストではブラウザのキャッシュから返されます。

Service Worker の「インストール」イベントでこれらのファイルを取得すると、なぜこれが異なるのですか?

ところで、私は全体的なネットワーク リクエストを減らそうとしているので、これらのファイルを再度ダウンロードするのはあまり良いことではありません..

ではapp.js、ナビゲーター オブジェクトで serviceWorker の存在を確認し、利用可能な場合は SW を登録しています。

SW を登録しようとすると、Firefox で次のエラーが表示されます。service-worker.jsまた、ファイルがsrcディレクトリの下にあることも確認しました。

Firefox (バージョン 59.0.2) でabout:configを確認すると、サービス ワーカーとストレージ API が有効になっていました。だから、それは問題ではないはずです。

PS: Chrome でも同じコードで問題なく動作します。