无法在“WorkerGlobalScope”上执行“importScripts”答案

【问题标题】：Failed to execute 'importScripts' on 'WorkerGlobalScope'无法在“WorkerGlobalScope”上执行“importScripts”
【发布时间】：2019-09-23 14:09:37
【问题描述】：

我正在尝试在我的 pwa nuxtjs 应用中启用 OneSignal 通知。

modules: [
    '@nuxtjs/axios',
    '@nuxtjs/onesignal',
    '@nuxtjs/pwa',
  ],

  oneSignal: {
    cdn: true,
    OneSignalSDK: 'https://cdn.onesignal.com/sdks/OneSignalSDK.js',
    init: {
      appId: 'xxxxxxxxxxx',
      allowLocalhostAsSecureOrigin: true,
      welcomeNotification: {
          disable: true
      }
    }
  },
  workbox: {
    dev: true,
    debug: true
  },

我收到弹出通知，当我按Accept 时，出现以下错误：

获取脚本时收到错误的 HTTP 响应代码 (404)。 sw.js?1557093232129:1 未捕获的 DOMException：执行失败

'WorkerGlobalScope' 上的'importScripts'：脚本位于 “http://localhost:3333/_nuxt/workbox.dev.4c4f5ca6.js”加载失败。在http://localhost:3333/sw.js?1557093232129:1:1 在http://localhost:3333/OneSignalSDKWorker.js?appId=xxxxxxxx:1:1 （匿名）@sw.js?1557093232129:1

ServiceWorkerManager.js:371 [Service Worker 安装] 安装服务工作者失败类型错误：无法注册服务工作者： ServiceWorker 脚本评估失败

我在静态文件夹中也有sw.js 文件。在 Github 问题部分发现了类似的问题，但没有真正的解决方案。

【问题讨论】：

你检查过this github post吗？
链接似乎死了 [*] @MαπμQμαπkγVπ.0

标签： javascript progressive-web-apps nuxt.js onesignal

【解决方案1】：

我们的服务工作者 OneSignalSDKWorker.js 和 OneSignalSDKUpdaterWorker.js 会覆盖在最顶层（站点根）服务工作者范围内注册的其他服务工作者。解决方案是使用 importScripts() 将所有其他 Service Worker 脚本合并到我们的 Service Worker 脚本中，并注册合并后的 Service Worker 而不是原来的 Worker。

OneSignalSDKWorker.js 和 OneSignalSDKUpdaterWorker.js 都包含以下代码：

importScripts('https://cdn.onesignal.com/sdks/OneSignalSDKWorker.js');

请同时修改 OneSignalSDKWorker.js 和 OneSignalSDKUpdaterWorker.js 以导入您的其他 Service Worker 脚本，例如：

importScripts('https://example.com/sw.js');
importScripts('https://cdn.onesignal.com/sdks/OneSignalSDKWorker.js');

我们建议使用上述方法，而不是将我们的 service worker 导入另一个文件，因为我们的 web SDK 替换了在根范围内注册的其他 worker。

另外，请务必修改您网站的代码以注册 OneSignalSDKWorker.js 而不是您自己的 Worker。您可以使用以下代码执行此操作：

navigator.serviceWorker.register('/OneSignalSDKWorker.js');

service workers的信息

【讨论】：

【解决方案2】：

你的配置应该是这样的：

  oneSignal: {
    cdn: true,
    OneSignalSDK: 'https://cdn.onesignal.com/sdks/OneSignalSDK.js',
    init: {
      appId: 'xxxxxxxxxxx',
      allowLocalhostAsSecureOrigin: true,
      welcomeNotification: {
          disable: true
      }
    },
    importScripts: ["/sw.js"]
  }

【讨论】：