hi,你好!欢迎访问本站!登录
本站由简数采集腾讯云宝塔系统阿里云强势驱动
当前位置:首页 - HTML - 正文 请牢记本站网址www.sosophp.cn

详解WebSocket跨域问题解决【html5教程】

2019-11-26HTML搜搜PHP网44°c
A+ A-
这篇文章重要引见了详解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

});

服务器端

var io = require(‘socket.io’)(server);

io.on(‘connection’,function(client){

client.emit(‘data’,’hello WebSocket from 3001.’);

});

本日就说到这里,愿望对人人有所协助,同时人人假如不想太花时候去做WebSocket这块,能够尝试运用三方WebSocket,相似GoEasy 极光之类的。

总结:以上就是本篇文的全部内容,愿望能对人人的进修有所协助。更多相干教程请接见Html5视频教程!

相干引荐:

php公益培训视频教程

HTML5图文教程

HTML5在线手册

以上就是详解WebSocket跨域题目解决的细致内容,更多请关注ki4网别的相干文章!

  选择打赏方式
微信赞助

打赏

QQ钱包

打赏

支付宝赞助

打赏

  选择分享方式
  移步手机端
详解WebSocket跨域问题解决【html5教程】

1、打开你手机的二维码扫描APP
2、扫描左则的二维码
3、点击扫描获得的网址
4、可以在手机端阅读此文章