vue-socket.io跨域问题的解决方法

报错信息:

1 Access to XMLHttpRequest at ‘http://192.168.37.130:5050/socket.io/?EIO=3&transport=polling&t=N0oqNsW‘ from origin ‘http://localhost:8080‘ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin‘ header is present on the requested resource.
2 vue-socketio.js?70bb:8 GET http://192.168.37.130:5050/socket.io/?EIO=3&transport=polling&t=N0oqNsW net::ERR_FAILED

解决办法:

 1 //vue.config.js
 2
 3 module.exports = {
 4   devServer: {
 5     proxy: {
 6         ‘/socket.io‘: {
 7           target: ‘http://192.168.37.130:5050‘,
 8           ws: true,
 9           changeOrigin: true
10         },
11         ‘sockjs-node‘: {
12           target: ‘http://192.168.37.130:5050‘,
13           ws: false,
14           changeOrigin: true
15         },
16     }
17
18   }
19 }

原文地址:https://www.cnblogs.com/zhengze/p/12294916.html

时间: 2024-11-06 07:21:05

vue-socket.io跨域问题的解决方法的相关文章

AJAX及其跨域的主要解决方法

AJAX = Asynchronous JavaScript andXML(异步的 JavaScript 和 XML).通过在后台与服务器进行少量数据交换,使网页实现异步更新.要明白异步交互可以通过同步和异步的对比很容易明白: 同步交互,就是最常见的click-refresh模式,点一个连接或提交一个表单,然后就必须重载整个页面 异步交互,javascript根据返回的数据,不刷新页面而改变当前页面的显示,例如:新浪微博,百度地图. Ajax的异步交互从XMLHttpRequest这个对象开始,

jquery ajax跨域的完美解决方法(jsonp方式)

ajax跨域请求的问题,JQuery对于Ajax的跨域请求有两类解决方案,不过都是只支持get方式,接下来为大家详细介绍下客户端JQuery.ajax的调用代码 今天在项目中需要做远程数据加载并渲染页面,直到开发阶段才意识到ajax跨域请求的问题,隐约记得Jquery有提过一个ajax跨域请求的解决方式,于是即刻翻出Jquery的API出来研究,发 JQuery对于Ajax的跨域请求有两类解决方案,不过都是只支持get方式.分别是JQuery的 jquery.ajax jsonp格式和jquer

vue工程本地代码请求http发生跨域提示错误解决方法

这个可以使用代理进行跨域,这样看来跨域的方法就有几种了,对于iframe中的用postmassage,对于vue工程中的跨域则使用代理模式. 代理模式配置如下: 在config文件夹下找到index.js文件.找到module.exports下边的proxyTable属性,改成: // proxyTable: {},//代理才能跨域发送请求 proxyTable: devEnv.OPEN_PROXY === false ? {} : { '/proxyApi': { target: 'http:

SpringBoot+Ajax跨域安全问题及解决方法

〇.遇到跨域安全问题 在学习SpringBoot过程中,遇到了这样一个问题.当时用SpringBoot开发Rest服务接口,然后用Ajax请求获取数据,来实现前后端分离.但是在前端请求时,始终不能显示应该显示的数据.从浏览器的控制台报错来看(如下图),应该是遇到了跨域安全的问题. 一.为什么会出现跨域安全问题? 要解决这个问题,首先得知道为什么会出现这个问题.通过了解,出现跨域安全问题的原因一般是以下三个问题:浏览器收到了正确的返回数据但是做出了限制.发出去的请求是XMLHttpRequest请

jQuery ajax跨域请求的解决方法

在Ajax应用中,jQuery的Ajax请求是非常容易而且方便的,但是初学者经常会犯一个错误,那就是Ajax请求的url不是本地或者同一个服务器下面的URI,最后导致虽然请求200,但是不会返回任何数据,事实上简单来说请求同一个域名下的url或者说用不带http的绝对路径和相对路径请求是没有任何问题的,如果请求外部资源,那么这就称为跨域请求. 由于安全性的问题,浏览器默认不支持跨域调用,晚上也有很多方法,各有优缺点,但是有一个比较好的解决方法这也是jQuery1.2之后官方推荐的,那就是在客户端

海康、大华等网络摄像头RTSP_Onvif网页无插件直播流媒体服务器EasyNVR鉴权出现跨域问题的解决方法

背景分析 随着平安城市.智慧城市.雪亮工程.智能交通等各项建设的持续开展,安防逐渐得到普及,面对如此广阔的市场,对安防企业来说不仅仅是机遇更多的是挑战.现今大多数摄像头一直没能摆脱人工监控的传统监控方式,由此导致了大量视频数据堆积占用存储资源.实时性差.检索困难等问题,海量摄像头带来的海量视频数据检索工作需要耗费大量警力. 为了解决这些问题,近年来,视频监控行业发展方向主要为:“高清化.网络化.智能化”.视频监控设备技术性极强,系统的创新升级同时也在引导市场需求的变化并创造了新的市场需求. Ea

ajax本地跨域请求以及解决方法

什么是跨域? ??我们通常所说的跨域是狭义的,是由浏览器同源策略限制的一类请求场景.所谓同源是指"协议+域名+端口"三者相同,即便两个不同的域名指向同一个ip地址,也非同源,只要没有同时满足这三个条件的请求即为跨域请求,跨域请求控制台一般会出现类似错误: XMLHttpRequest cannot load http://xxxxx.php. No 'Access-Control-Allow-Origin' header is present on the requested reso

跨域几种解决方法

1.jsonp  目标服务器设置callback 函数   服务器操作   2.cors  服务器设置header :Access-Control-Allow-Origin   服务器操作 eader('content-type:application:json;charset=utf8'); // 指定允许其他域名访问 //header('Access-Control-Allow-Origin:http://www.example.com'); 例子 header('Access-Contro

访问腾讯存储桶中的文件,跨域问题的解决

报错如上图,场景:前端同事在使用js请求时,引出来的这个问题. 就报错而言不难解决,在对相应的桶做一个cors配置即可.但问题是依旧是报跨域的错,配置了跨域头未生效. 究其原因,大概率是可能在用户第一次访问cdn,cdn会检查数据没有,回源到源站进行访问.源站对比将数据经过cdn反馈给客户端浏览器.浏览器比对Access-Control-Allow-Origin 后,允许正确,所以跨域正常. 当第二个用户访问时,cdn检测有这个文件,所以会直接给客户端反馈缓存页面.由于CDN之所以失败是因为CD