WebSocket兼容到低版本浏览器

简介: 就目前而言,WebSocket是最好的Web通信解决方案了。但是IE从10才开始兼容它,对于目前大量IE8存在的市场,原生的WebSocket显然不太实用,我们需要低版本兼容的解决方案。于是我模拟WebSocket在浏览器上的行为,用AS3写了个兼容的版本。

就目前而言,WebSocket是最好的Web通信解决方案了。但是IE从10才开始兼容它,对于目前大量IE8存在的市场,原生的WebSocket显然不太实用,我们需要低版本兼容的解决方案。于是我模拟WebSocket在浏览器上的行为,用AS3写了个兼容的版本。 
内容有点多,这篇只把演示给搞定,至于AS的源码就丢到下一篇了。下面是效果图: 

演示下载地址: WebSocket兼容到低版本浏览器(演示实例) 
页面代码比较简单,用法和正常的WebSocket基本一样,只是引用了WebSocket.js这个文件来兼容低版本浏览器。当然还有个WebSocket.swf需要放在与页面相同的目录下。 





 服务器程序使用NodeJS代码,随手写的聊天室功能,仅仅为了实现功能而已,作为演示代码不要吐槽考虑的不够周全。里面的 /a> 和  在之前的文章中有出现过,这里就不贴出来了。由于需要兼容AS版,所以服务器程序需要比普通的WebSocket多一个AS的域安全验证的步骤。这是关键所在,如果使用现成的WebSocket库之类的东西可能得稍微修改源码才能兼容AS版。 
var crypto=require('crypto');
var fs=require('fs');
var WS='258EAFA5-E914-47DA-95CA-C5AB0DC85B11';

var pool=[]; //连接池

require('net').createServer(function(o){
  var key;
  o.on('data',function(e){
    if(!key){
      var data=e.toString();
      //Flash握手
      if(data=='\0')
        return fs.readFile('policy.txt',function(err,data){
          o.write(data+'\0');
        });
      //WebSocket握手
      if(key=data.match(/Sec-WebSocket-Key: (.+)|$/)[1])
        key=crypto.createHash('sha1').update(key+WS).digest('base64'),
        o.write([
          'HTTP/1.1 101 Switching Protocols',
          'Upgrade: websocket',
          'Connection: Upgrade',
          'Sec-WebSocket-Accept: '+key
        ].join('\r\n')+'\r\n\r\n');
    }else{
      //解析数据
      var frame=decodeDataFrame(e);
      //文本帧
      if(frame.Opcode==1){
        //转义数据
        var content=frame.PayloadData.replace(/\W/g,function(e){
          e=e.charCodeAt(0).toString(16);
          if(e.length==3)e='0'+e;
          return '\\'+(e.length>2?'u':'x')+e;
        }),client=o.remoteAddress+":"+o.remotePort,buffer;
        //包装成JSON格式,并做成一个数据帧
        buffer=encodeDataFrame({
          FIN:1,Opcode:1,
          PayloadData:'{"client":"'+client+'","content":"'+content+'"}'
        });
        //对所有连接广播数据
        for(i=0;i      };
    };
  });
  //断开时从连接池中移除
  o.on("close",function(){
    for(i=0;i  });
  //放入连接池中
  pool.push(o);
}).listen(8000);
 Flash握手就是AS的域安全验证,这个在之前的文章“  ”中有详细的说过,其实就是加载一个策略文件给它。把这个过程嵌入到WebSocket的握手之前就行。 
WebSocket.js的代码就不贴出来说明了。它负责构造一个类似原生WebSocket的接口的功能,里面会对不兼容WebSocket的浏览器加载WebSocket.swf来使之兼容。 
这个程序也是最近刚写的,存在漏洞在所难免,如果实用的话以后将慢慢完善它。

目录
相关文章
|
XML 存储 网络协议
tcp支持浏览器websocket协议
tcp支持浏览器websocket协议
|
8月前
|
JavaScript 前端开发 API
浏览器节能机制导致Websocket断连的坑
浏览器的节能机制虽然有助于节省系统资源和延长电池寿命,但也可能导致WebSocket连接的不稳定性。通过保持活跃连接、实现自动重连机制和利用 `Page Visibility API`检测页面状态,开发者可以有效应对这些挑战,确保WebSocket连接的稳定性和可靠性。这些措施在实际项目中的应用,可以显著提升WebSocket通信的稳定性,提供更好的用户体验。
378 13
|
11月前
|
监控 前端开发 JavaScript
浏览器节能机制导致Websocket断连的坑
浏览器节能机制导致Websocket断连的坑
204 0
|
监控 前端开发 JavaScript
记录浏览器节能机制导致Websocket断连问题
近期,在使用WebSocket(WS)连接时遇到了频繁断连的问题,这种情况在单个用户上每天发生数百次。尽管利用了socket.io的自动重连机制能够在断连后迅速恢复连接,但这并不保证每一次重连都能成功接收WS消息。因此,我们进行了一些的排查和测试工作。
710 1
记录浏览器节能机制导致Websocket断连问题
|
前端开发 JavaScript API
如何让 Websocket兼容低版本浏览器
如何让 Websocket兼容低版本浏览器
477 2
|
前端开发 JavaScript Java
websocket部署后在谷歌内核浏览器异常断开问题
后端springboot前端vue开发的网页,利用websocket实现操作数据库前端网页实时刷新的功能
websocket部署后在谷歌内核浏览器异常断开问题
|
JavaScript Java 前端开发
解决浏览器不兼容websocket
解决浏览器不兼容websocke原文地址thttp://www.bieryun.com/935.html 本例使用tomcat 7.0的websocket做为例子。 1.新建web project。
2969 0
|
Web App开发 移动开发
webSocket浏览器握手不成功(解决)
websocket与服务端握手会报握手不成功的错误解决方法: 首先是服务端首次收到请求要回报给客户端的报文要做处理多的不说,方法敬上: 1 /// 2 /// 打包请求连接数据 3 /// 4 /// 5 ...
1687 0
|
JavaScript Java 前端开发
解决浏览器不兼容websocket
本例使用tomcat 7.0的websocket做为例子。 1.新建web project。2.找到tomcat 7.0 lib 下的 catalina.jar,tomcat-coyote.jar添加到项目中.
1025 0

热门文章

最新文章