记录载入页面时与 ws://XXX地址/sockjs-node/xxx/websocket 的连接中断---解决办法

本文档介绍了在开发Vue+SpringBoot项目时遇到WebSocket连接中断的警告问题,详细阐述了问题的现象,包括两种不同的警告情况,并提供了详细的解决方案。通过在vue.config.js文件中添加`ws:false`来关闭WebSocket代理,从而消除警告。修改配置后需要重启Vue项目以使改动生效。
摘要由CSDN通过智能技术生成

前言

在开发vue+springboot项目的时候,不清楚是跨域哪里没设置好还是怎么样,虽然对跨域方面没有影响,但是总弹出
警告让人心烦。
因此,在这个文章,记录一下如何解决,以防忘记

警告提示信息

根据浏览器不同,可能会对警告内容有进行翻译,所以一般情况能看到两种情况的警告都属于当前需要解决的问题。

情况一:

在这里插入图片描述
载入页面时与 ws://10.160.82.2:8083/sockjs-node/060/v1fz4jeu/websocket 的连接中断。

情况二:

在这里插入图片描述sockjs.js?9be2:1683 WebSocket connection to ‘ws://localhost:8083/sockjs-node/163/wprlyhno/websocket’ failed: Invalid frame header

解决方案

修改vue.config.js文件

一般情况,我们编写vue项目都是有配置文件的,包括跨域链接、端口修改等等,都是在配置文件修改

这次解决的方法,同样是在配置文件

修改前
module.exports = {
  publicPath: '/',
  lintOnSave: false,
  devServer: {
    disableHostCheck: true,
    open: false,
    port: 8083, // 前端端口
    proxy: { // 代理
      '^/': {
        target: 'http://localhost:后端端口/项目',// 连接后端跨域配置跨域
        changeOrigin: true,
        secure: false,
        pathRewrite: {
          '^/': '/'
        }
      }
    }
  }
};
修改后
module.exports = {
  publicPath: '/',
  lintOnSave: false,
  devServer: {
    disableHostCheck: true,
    open: false,
    port: 8083, // 前端端口
    proxy: { // 代理
      '^/': {
      ws: false // 在这里添加本代码
        target: 'http://localhost:后端端口/项目',// 连接后端跨域配置跨域
        changeOrigin: true,
        secure: false,
        pathRewrite: {
          '^/': '/'
        }
      }
    }
  }
};

重启前端

修改完之后,需要重启vue项目,不然配置文件是不会生效

结语

以上,该警告就不再弹出

  • 3
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值