前端之家收集整理的这篇文章主要介绍了
详解WebSocket跨域问题解决,
前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
WebSocket protocol是HTML5一种新的协议。它实现了浏览器与服务器全双工通信,同时允许跨域通讯,是server push技术的一种很好的实现。我们使用Socket.io,它很好地封装了webSocket接口,提供了更简单、灵活的接口,也对
不支持webSocket的浏览器提供了向下兼容。
项目中遇到javascript跨域问题,父
页面和子
页面要通信,并且父子
页面跨域,怎么办?
项目中要保证父子
页面通信是点对点,需要在服务端建立对父子
页面WebSocket的对应关系,即父
页面发的消息只被子
页面收到,子
页面的消息也只被父
页面收到我们做了以下工作,严格保证了
WebSocket通信是点对点:
一是建立WebSocket
链接的URL
加上时间戳保证通信会话是唯一的;
二是在服务端保证父子
页面WebSocket一一对应关系。父子
页面的WebSocket在Open时都会向服务端发出消息进行
注册,建立Senssion之间的对应关系。然后父子
页面就可通过双方约束的通信协议进行通信了。
这里我们写个demo:
var p = document.getElementsByTagName(‘p’)[0];
var io = io.connect(‘http://127.0.0.1:3001’);
io.on(‘data’,function(data){
alert(‘2S后改变数据’);
p.innerHTML = data
});