如何解决为什么我无法在localhost上注册service-worker.js？

当我尝试在开发模式下构建VueJs应用程序时，它破坏了service-worker.js文件。

我使用的是：

npm run build-dev

设置：

"build-dev": "vue-cli-service build --mode development",

我注册了：

/* eslint-disable no-console */

import { register } from 'register-service-worker'

register(`${process.env.BASE_URL}service-worker.js`,{
  ready() {
    console.log('App is being served from cache by a service worker.\n' + 'For more details,visit ...');
  },registered() {
    console.log('Service worker has been registered.');
  },cached() {
    console.log('Content has been cached for offline use.');
  },updatefound() {
    console.log('New content is downloading.');
  },updated() {
    console.log('New content is available; please refresh.');
  },offline() {
    console.log('No internet connection found. App is running in offline mode.');
  },error(error) {
    console.error('Error during service worker registration:',error);
  }
})

，但是在加载页面时，它也会调用http://localhost:5000/service-worker.js（在vue-cli-service build的情况下不处于生产模式；在那里，它似乎包含在通用的“已编译”脚本中）。当然，它不在/script/service-worker.js路径中，因此找不到它。但是我希望它像prod一样使用已编译的.js进行编译。

我该如何解决？

解决方法

问题可能与您正在使用的http客户端有关。默认情况下，您可能需要使用本地主机来找到文件'service-worker.js'。因此您可以使用：

devServer.proxy

module.exports = {
  devServer: {
    proxy: '${baseUrl}'
  }
}

我认为由于服务人员需要SSL，请尝试在本地主机上添加某种虚假的ssl。