Chromium中的PWA本地主机网络故障

Question

我目前正在将Service-Worker集成到我的应用程序中。但是当我想在本地计算机上进行测试时遇到了问题。

install-事件中的缓存失败。我搜索了两天的错误，但是我再也没有想法了。当我在例如上部署网站时netlify一切正常。

这就是“网络”标签给我的：

开发者控制台正在打印：

浏览器：Chromium Version 70.0.3538.77 (Official Build)

我在Chrome标志中激活了#allow-insecure-localhost。 Webpack正在https://localhost:8081上提供服务（带有自签名证书）。如果我右键单击失败的网络请求，然后单击Open in new tab，一切正常。 奇怪的是，失败的文件每次都会更改。

我的index.jsx中的代码（Webpack的入口点）：

...
if ('serviceWorker' in navigator) {
  window.addEventListener('load', function() {
    navigator.serviceWorker
    .register('/serviceWorker.js', { scope: "/" })
    .then(e => {
      console.log('Service Worker Registered');
      console.log(e);
    })
    .catch(e => {
      console.log("Service Worker fail");
      console.log(e);
    })
  });
}
...

我的serviceWorker.js中的代码

let cacheName = 'test';
let cachedURLs = [
    "/",
    "/bundle.js",
    "/manifest.webmanifest",
    "/favicon.ico",
    "/favicon-256.png"
];

self.addEventListener('install', function(e) {
  console.log('[ServiceWorker] Install');
  e.waitUntil(
      caches.open(cacheName).then(function(cache) {
        console.log('[ServiceWorker] Caching app shell');
        return cache.addAll(cachedURLs);
      })
  );
});

self.addEventListener('fetch', function(event) {    
  event.respondWith(
      caches.match(event.request).then(function(response) {
        return response || fetch(event.request);
      })
  );    
});

---

编辑：如评论中所述，我在catch上添加了cache.addAll块：

return cache.addAll(cachedURLs).catch(err => console.log('error: ', err));

但是不幸的是，它并不冗长：

error:  TypeError: Failed to fetch

出于完整性考虑，这是Chromium针对失败请求报告的内容（在本例中为bundle.js）