2017-10-28 2 views
0

を使用ServiceWorkerから呼び出すフェッチありません。 5行目のフェッチ呼び出しは、ブラウザのキャッシュ内を最初に調べるかどうかを調べます。フェッチ通常のブラウザのキャッシュを使用するか、それをバイパスし、例えば、サーバ</p> <p>に常に要求を送信ServiceWorkerで呼び出した場合、私は思ったんだけど、通常のブラウザのキャッシュ

self.addEventListener('fetch', function(event) { 
    event.respondWith(
    caches.open('mysite-dynamic').then(function(cache) { 
     return cache.match(event.request).then(function (response) { 
     return response || fetch(event.request).then(function(response) { 
      cache.put(event.request, response.clone()); 
      return response; 
     }); 
     }); 
    }) 
); 
}); 

答えて

0

これは良い質問です。答えは:SWの内部でのフェッチは、ブラウザコンテキストでのフェッチと同じように機能します。これは、ブラウザのHTTPキャッシュがチェックされ、その後にネットワークに照会されることを意味します。 SWからのフェッチは、HTTPキャッシュをバイパスしません。

これは、静的資産の名前付けに慎重でない場合、競合状態になる可能性があります。

例:ブラウザのHTTPキャッシュは、それが

  • は現在、ファイルの内容が更新されていることのために、最初の要求の後1Y
    1. asset.cssは、最大エージングを持つサーバから提供されます;ファイルは異なりますが、名前はまだ同じです(asset.css)
    2. ファイルへのフェッチイベントasset.cssは、HTTPキャッシュと、SWがファイルをチェックするために実装するロジックから提供されるようになりました 1:サーバーは、実際にはこの時点では、サーバー上のファイルがキャッシュされ、何かが

    た軽減を壊しているいくつかの他のファイルとの互換性がない可能性があり

  • HTTPキャッシュから、ステップ1からの最初のファイルを取得するにつながっていますコンテンツが変更されたときは、常に静的資産の名前を変更してください。 2.クエリ文字列を含める(asset.cssは要求しないで、asset.css?timestamporsomethingの場合)

    非常に良い読み取り値:https://jakearchibald.com/2016/caching-best-practices/

  • 関連する問題