私は現在、一部では、このようなルックスで、もちろんのでは管理サービスワーカーキャッシュ
self.addEventListener('install', function(event) {
event.waitUntil(
caches.open('v1').then(function(cache) {
return cache.addAll([
'/react-redux/node_modules/react/dist/react-with-addons.js',
'/react-redux/node_modules/react-dom/dist/react-dom.js',
'/react-redux/a.js'
]);
})
);
});
を実験してるサービスワーカーのコードキャッシュから返す、または項目場合は、ネットワーク要求を実行し、標準のフェッチイベントリスナーそこにいない。
しかし、どのような場合は、上記の例から、a.js
、とだけa.js
がされ、更新-どのように私は、サービス労働者がそのファイルを更新するために得るが、のみファイルです。ユーザーが次回自分のページを参照するときに、は、サービス休暇中のファイルの最新バージョンをにプルしないようにするにはどうすればよいですか?
例えば、私はそれらのファイルのURLへのキャッシュバスターを追加することです想像できる最高の
'/react-redux/node_modules/react/dist/react-with-addons.js?hash=1MWRF3...'
その後、私は同じ、現在でこれらのファイルを要求するために使用しているものは何でもモジュールローダー更新ハッシュ/キャッシュバスターを作成し、次にSWインストールイベントで現在のキャッシュキーを反復処理し、古くなったものを削除し、欠落しているものを追加します。
はとなります。ファイルが更新されたときに送信されたネットワーク要求は、現在失効しているサービスワーカーのものと一致しないため、同じネットワークフォールバックが発生します。サービスワーカーのインストールイベントのセレクティブキャッシュの挿入は、すでに存在しているキャッシュに物事を追加しようとしません。
もちろん、サービスワーカーコードはこれらのハッシュ値が(ビルドプロセスから自動的に)変更されるため変更されるため、ファイルが変更されたときにSWを再インストールするようにすることもできます。
しかし、もっと簡単な方法があるとは思えません。ある?
優秀 - これらのリソースを見ます。ありがとう、トン。それで...あなたはJake Archibaldと知り合いですか? :) –
はい、私はジェイクの同僚であることの区別があります! –
sw-precache - クライアントサイド/モジュールの読み込みとどのように統合されていますか?あなたはWebpack、SystemJS、または他のオプションを使用している可能性があります。sw-precacheは正しいURLを出力しますか?それはあなたのクライアントローダーと同期する責任がありますか? –