执行vue项目的时候：【报错】WebSocket connection to ‘ws://xxx.xxx.x.xxxx:8080/ws‘failed:_vue 本地调试websocket 连接不上

​

报错

在运行vue项目的时候，成功执行npm run serve，进入网页查看管理员工具的时候出现多个相同的报错：【报错】WebSocket connection to ‘ws://xxx.xxx.x.xxxx:8080/ws‘failed:

如图：

解决方法

如何是项目长时间不用，只需重启项目即可，如果不行则执行以下步骤

在vue项目中，可以在vue.config.js文件中添加以下代码

const { defineConfig } = require('@vue/cli-service');

module.exports = defineConfig({
  devServer: {
    host: '0.0.0.0',
    // https: true,
    port: 8080,
    client: {
      webSocketURL: 'ws://0.0.0.0:8080/ws',
    },
    headers: {
      'Access-Control-Allow-Origin': '*',
    },
  },
  lintOnSave: false,
  transpileDependencies: true,
});


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

​【参考文章】
原文链接：https://blog.csdn.net/m0_73641796/article/details/133912282