ワークボックス2.1.0のプリキャッシングに関する問題

Question

私はサービスワーカーを生成するためにワークボックス2.1.0を使用しています。サーバーのassetsディレクトリ（index.htmlとclear.pngなど）とCDNの1つのファイルからいくつかのファイルをプリキャッシュする必要があります（たとえば、https://akamai.com/dummy/path/app.js）。 私は建物のために塊茎を使用しています。これは、コードが

ので

gulp.task('sw',() => { 
     return wbBuild.generateSW({ 
      globDirectory: '.', 
      swDest: 'sw_gulp_generated.js', 
      staticFileGlobs: [ 
       'index.html', 
       'clear.png' 
       ],   
      verbose: true, 
    }) 
     .then(() => { 
     console.log('Service worker generated.'); 
     }) 
     .catch((err) => { 
     console.log('[ERROR] This happened: ' + err); 
     }); 
    }); 

をどのようになる、これは正常に動作され、生成されたサービスワーカーは、プリキャッシュリスト内のファイルは、ここにそれが行くた両方：

const fileManifest = [ 
    { 
    "url": "index.html", 
    "revision": "b6eb7cd7599ed6584a715cdfc75a81c0" 
    }, 
    { 
    "url": "clear.png", 
    "revision": "e17de36d2c2ddf7b068892fa4678cd31" 
    }, 

]; 
const workboxSW = new self.WorkboxSW(); 
workboxSW.precache(fileManifest); 
//more code follows ... 

私がテストし、それが完璧に動作

質問はです。第3のアセット（https://akamai.com/dummy/path/app.js）をプレキャッシュリストに追加するにはどうすればよいですか。私はstaticFileGlobsでそれを入れてみましたが、それはエラーが出て言って：

明らか

One of the glob patterns doesn't match any files 

それはglobDirectory内のファイルhttps://akamai.com/dummy/path/app.jsを見つけようとすると、それを見つけることができないため。

基本的に、gulp（または任意のビルドツール）を使用しているときに、生成されたサービスワーカーのプリキャッシュリストにCDN URLを挿入するにはどうすればよいですか？

Answer 1

generateSWはカスタムprecacheのルールを受け入れるようには見えません。あなたはruntimeCachingオプションを渡すことができます。サードパーティのファイルがクライアントから要求された場合にのみキャッシュします。要求にエラー応答がある場合はサードパーティの要求であるため、エラー応答はキャッシュされ、not updatedになります。

wbBuild.generateSW({ 
    globDirectory: '.', 
    swDest: 'sw_gulp_generated.js', 
    staticFileGlobs: [ 
    'index.html', 
    'clear.png' 
    ],   
    verbose: true, 
    runtimeCaching: [{ 
    urlPattern: 'https://exapmle.com/file.min.js', 
    handler: 'staleWhileRevalidate', 
    options: { 
     cacheableResponse: { 
     statuses: [0], 
     }, 
    }, 
    }] 
})