2017-02-19 3 views
3

私はServiceWorkerを使用していますが、devモードでは完全に動作しますが、私の問題は本番モードではバンドル名がハッシュを使用して生成されていることです。 1234das3123ad5.bundle.jsなので、サービスワーカーはキャッシュしません。私はそれを達成する方法上の任意の例を参照してくださいいけないCache APIのドキュメントではServiceWorker/Cache APIのワイルドカード

self.addEventListener('install', function(event) { 
    // pre cache a load of stuff: 
    event.waitUntil(
    caches.open('mycache').then(function(cache) { 
     return cache.addAll([ 
     '/dist/bundle.js', 
     '/dist/app.css', 
     '/dist/index.html', 
     'https://cdnjs.cloudflare.com/ajax/libs/antd/2.7.2/antd.css' 
     ]); 
    }) 
) 
}); 

:私のSWコードは次のようになります。

はもちろん、私のようなもの持つ、 distフォルダの下にすべてをキャッシュすることができます:

self.addEventListener('install', function(event) { 
    // pre cache a load of stuff: 
    event.waitUntil(
    caches.open('mycache').then(function(cache) { 
     return cache.addAll([ 
     '/dist/', 
     ]); 
    }) 
) 
}); 

をしかし、私は、長期的には良い、エレガントな解決策を見つけるいけません。キャッシュにワイルドカードを入れる方法ですか? '/dist/*.bundle.js'のようなもの?

答えて

4

ウェブにはフォルダという概念がありません。具体的には、ブラウザが接頭辞で始まるすべての有効なURLを知る方法はありません。

残りのサイトは、何らかの形でリビジョンアセットのURL変更を処理する必要があるため、サービスワーカーで同じソリューションを使用しないのはなぜですか。私は私のブログのためにやったことだ

- Djangoの静的ファイルマネージャは、正しいURLをhttps://jakearchibald.com/sw.js

+0

THXジェイクが追加されますが、私はおそらくその場で正しいURLを生成するためのWebPACKと方法を見つけるだろう。 –

+0

だから、swpack.jsはwebpackやsed/awkのような他のメソッドを使って生成されたバンドル名に基づいて動的に生成/変更されますか? –

+1

もちろん、 'fetch( 'files.json')を使って名前をロードすることもできます。次に(r => r.json())' –