問題タブ [service-worker-events]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
1 に答える
35 参照

service-worker - JavaScript オフライン サービスワーカーの例はどのように機能しますか?

https://googlechrome.github.io/samples/service-worker/basic/のページに は、最新のオフライン Web ページを使い始めるために必要なスクリプトがすべて含まれています。私はこのテーマにたどり着く前に、無駄な時間をこのテーマの調査に費やしました。突然、私が読んでいたすべてのことが意味をなすようになりました。繰り返しますが、HTML5 は優れた開発システムとして私に感銘を与えました。

メインページで実行する必要があるスクリプトの小さなスニペットと、オンラインのときにサーバーからファイルをフェッチするサービスワーカーの完全なスクリプト、またはオフラインのときにキャッシュからファイルをフェッチする完全なスクリプトがあります。

動作するようになるまでに 1 時間もかかりませんでした。注: localhost で http を使用してテストできます。他のサーバーには https 接続が必要です。Google および Firefox デバッガーは、サービスワーカーのソースを表示しません。

serviceworker の例で示された機能が、私のアプリに必要なものに非常に近いことは最初から明らかでしたが、バグを発見したと思います。

アクティブ化ハンドラーは、古いキャッシュをクリーンアップすることになっています。これがスクリプトです - ページからの逐語的なものです。

簡単に言えば、古いキャッシュを削除するわけではありません。フィルターを実行して不要なキャッシュを特定する前に、キャッシュを削除しようとしていると思います。

私は経験豊富なプログラマーですが、このスニペットは私を怖がらせます。本番アプリとしては非常に短いですが、デバッグしている場合は読みにくいです。何が起こっているのかをより多くの開発者が理解できるように、作者がもっと冗長な方法でそれを書いていればよかったのに。

それはどのように機能しますか?