获取脚本时发生未知错误(Service Worker)

Question

下线时,我的服务工作者收到以下错误:

(unknown) #3016 An unknown error occurred when fetching the script

我的服务工作者看起来像这样:

var version = 'v1'

this.addEventListener('install', function(event){
  event.waitUntil(
     caches.open(version).then(cache => {
       return cache.addAll([
         'https://fonts.googleapis.com/icon?family=Material+Icons',
         'https://fonts.googleapis.com/css?family=Open+Sans:400,600,300',
         './index.html'
       ])
     })
   )
})

this.addEventListener('fetch', function(event) {
  event.respondWith(
    caches.match(event.request).then(function(resp) {
      // if it's not in the cache, server the regular network request. And save it to the cache
      return resp || fetch(event.request).then(function(response) {
        return caches.open(version).then(function(cache) {
          cache.put(event.request, response.clone())
          return response
        })
      })
    })
  )
})

它位于顶级目录,紧邻index.html中的清单导入:

<link rel="manifest" href="/manifest.json">

我在我的条目js文件中导入服务工作者.然后立即注册.

require('tether-manifest.json')
import serviceWorker from 'sw'

if ('serviceWorker' in navigator) {
  navigator.serviceWorker.register(serviceWorker)
  .then(() => {
    // registration worked
  }).catch(error => {
    throw new Error(error)
  })
}

它注册很好.在我离线之前我没有遇到错误.

我正在使用带有React的webpack,并在webpack中执行以下操作以将我的sw.js文件复制到dist文件夹:

loaders: [
      { // Service worker
        test: /sw\.js$/,
        include: config.src,
        loader: 'file?name=[name].[ext]'
      },
      { // Manifest
        test: /manifest\.json$/,
        include: config.src,
        loader: 'file?name=[name].[ext]'
      }
]

该错误未提供有关正在发生的事情的任何信息.

任何人都知道如何解决这个问题？

Answer 1

我有完全相同的问题,我花了一个小时试图找出它,事实证明我有一个相同来源的另一个选项卡左侧打开(所以使用相同的共享服务工作者),左侧选中了"离线"复选框这阻止了另一个标签sw.js因某些原因请求.

似乎脱机状态从Service Worker范围内的选项卡泄漏,而其他选项卡未正确反映或管理,而不是首先脱机的选项卡.

因此,请确保没有其他客户端运行相同的Service Worker - 您应该能够在DevTools> Application> Service Workers中找到它们.

Answer 2

对我来说，当我在安装时将 sw.js 添加到缓存中时，这个错误就消失了。只是忘了这样做，但它解决了问题。

Answer 3

在尝试其他操作之前，请检查您的https 证书是否无效或与您正在访问的 URL 不匹配。

例如，就我而言，我尝试使用为另一个域注册的证书访问 https://localhost。

虽然点击“继续”将允许我进入该站点，但这个确切的错误将被打印到控制台：

获取脚本时发生未知错误