在 angular5 中使用 sw 预缓存时排除子站点 url

Question

我可以在使用 sw 预缓存生成服务时排除一些 url worker.Below 是我的 swprecache.config.json

module.exports = {
navigateFallback: '/index.html',
stripPrefix: 'dist',
root: 'dist/',
staticFileGlobs: [
  'dist/index.html',
  'dist/**.js',
  'dist/**.css',
  'dist/**.ico',
  'dist/assets/images/**.jpg',
  'dist/assets/images/**.png',
  'dist/assets/images/**.gif',
  'dist/assets/js/**/**.js',
  'dist/assets/js/**.js',
  'dist/assets/css/**.css',
  'dist/assets/fonts/**.{js,html,css,png,jpg,gif,svg,eot,ttf,woff,ico}',
  'dist/**.{js,html,css,png,jpg,gif,svg,eot,ttf,woff,ico}',
   '!dist/Subscription/**.{js,html,css,png,jpg,gif,svg,eot,ttf,woff,ico}'
],

runtimeCaching: [{
  urlPattern: /^https:\/\/netdna\.bootstrapcdn\.com\//,
  handler: 'networkFirst'
}]

};

我尝试使用像'!dist/Subscription/**.{js,html,css,png,jpg,gif,svg,eot,ttf, woff,ico}'。但是我得到的不是 working.So 无法匹配任何路由错误，同时导航到 subsite.After 仅清除浏览器数据，我可以导航到子站点。谁能帮我解决这个问题，请找出我的错误

谢谢

Answer 1

这应该有效：

staticFileGlobs: [
  'dist/index.html',
  'dist/*.{js,css,ico}',
  'dist/!(Subscription)/**/*.{js,html,css,png,jpg,gif,svg,eot,ttf,woff,ico}'
]

在此处找到：https://github.com/GoogleChromeLabs/sw-precache/issues/97

Answer 2

在生成 service worker 之后，我检查请求是否包含 "Subscription" 在如下所示的获取事件中工作正常

 self.addEventListener('fetch', function(event) {
if (event.request.method === 'GET') {
// Should we call event.respondWith() inside this fetch event handler?
// This needs to be determined synchronously, which will give other fetch
// handlers a chance to handle the request if need be.
var shouldRespond;
if (event.request.url.match('^.*(\/Subscription\/).*$')) {
    return false;
}
  // OR

if (event.request.url.indexOf('/Subscription/') !== -1) {
    return false;
}

 .............}})

它工作正常。

在 angular5 中使用 sw 预缓存时排除子站点 url

Exclude subsite urls while using sw precache in angular5

angular

angular5

service-worker

sw-precache