让ie6也支持websocket采用flash封装实现


Posted in Javascript onFebruary 18, 2013

ie9都不支持websocket,何况ie6,但是websocket能开发那么酷的功能,怎么能让ie拦住我们的脚步?
但是怎么办?
用flash封装吧

具体的flash代码如下:

package { 
import flash.display.Stage; 
import flash.display.Sprite; 
import flash.events.*; 
import flash.external.ExternalInterface; 
import flash.system.Security; 
import flash.utils.Timer; 
import flash.net.Socket; 
import flash.utils.ByteArray; 
import flash.utils.Endian; 
public class websocket4ie extends Sprite { 
public static function main():void 
{ 
var websocket4ie:websocket4ie = new websocket4ie(); 
} 
private var debugEnabled:Boolean; 
private var movieName:String; 
private var handlers:String; 
private var server:String; 
private var port:Number; 
private var isDebug:Number; 
private var socket:Socket; 
private var socketBuffer:ByteArray = new ByteArray(); 
public function websocket4ie() { 
Security.allowDomain("*"); 
var counter:Number = 0; 
root.addEventListener(Event.ENTER_FRAME, function ():void { if (++counter > 100) counter = 0; }); 
this.movieName = root.loaderInfo.parameters.movieName; 
this.handlers = root.loaderInfo.parameters.handlers; 
this.server = root.loaderInfo.parameters.server; 
this.port = root.loaderInfo.parameters.port; 
this.isDebug = root.loaderInfo.parameters.debug; 
this.debug(this.port+''+this.server); 
try { 
this.debugEnabled = root.loaderInfo.parameters.debugEnabled == "true" ? true : false; 
} catch (ex:Object) { 
this.debugEnabled = false; 
} 
this.connectServer(); 
ExternalInterface.addCallback("sendData", this.sendData); 
} 
public function connectServer():void { 
socket = new Socket(); 
socket.endian = Endian.BIG_ENDIAN; 
socket.addEventListener(Event.CONNECT, onConnect); 
socket.addEventListener(Event.CLOSE, onClose); 
socket.addEventListener(IOErrorEvent.IO_ERROR, onIOError); 
socket.addEventListener(SecurityErrorEvent.SECURITY_ERROR, onSecurityError); 
socket.addEventListener(ProgressEvent.SOCKET_DATA, onSocketData); 
socket.connect(this.server, this.port); 
this.socket = socket; 
} 
public function onConnect(e:Event):void { 
//握手 
var headers:Array = new Array(); 
headers.push("GET /chat HTTP/1.1\r\n"); 
headers.push("Upgrade: websocket\r\n"); 
headers.push("Connection: Upgrade\r\n"); 
headers.push("Host: "+this.server+":"+this.port+"\r\n"); 
headers.push("Origin: null\r\n"); 
headers.push("Sec-WebSocket-Key: 6z4ezNfATjW5/FEMYpqRuw==\r\n"); 
headers.push("Sec-WebSocket-Version: 13\r\n\r\n\r\n"); 
this.socket.writeUTFBytes(headers.join('')); 
this.socket.flush(); 
} 
public function onTrueConnect():void { 
ExternalInterface.call(this.handlers+".onConnect",this.movieName); 
} 
public function onClose(e:Event):void { 
ExternalInterface.call(this.handlers+".onClose",this.movieName,'1'); 
} 
public function onIOError(e:IOErrorEvent):void { 
ExternalInterface.call(this.handlers+".onClose",this.movieName,'2'); 
} 
public function onSecurityError(e:SecurityErrorEvent):void { 
ExternalInterface.call(this.handlers+".onClose",this.movieName,'3'); 
} 
public var step:String = "head"; 
public var position:Number = 0; 
public function readOnData():void { 
var tmpPos:Number = this.position; 
this.socketBuffer.position = this.position; 
//read 一个 0x81 
if(this.socketBuffer.bytesAvailable>=1) { 
var h:Number = this.socketBuffer.readUnsignedByte(); 
this.debug("头:"+h); 
this.position += 1; 
if(this.socketBuffer.bytesAvailable>=1) { 
var len:Number = this.socketBuffer.readUnsignedByte(); 
this.debug("长度:"+len); 
this.position += 1; 
if(len<=125) { 
if(this.socketBuffer.bytesAvailable>=len) { 
this.onText(this.socketBuffer.readUTFBytes(len)); 
this.position += len; 
this.readOnData(); 
} else { 
this.position = tmpPos; 
return; 
} 
} else if(len==126) { 
if(this.socketBuffer.bytesAvailable>=2) { 
var trueLen:Number = this.socketBuffer.readUnsignedShort(); 
if(this.socketBuffer.bytesAvailable>=trueLen) { 
this.onText(this.socketBuffer.readUTFBytes(trueLen)); 
this.position += trueLen; 
this.readOnData(); 
} 
} else { 
this.position = tmpPos; 
return; 
} 
} 
} else { 
this.position = tmpPos; 
return; 
} 
} else { 
this.position = tmpPos; 
return; 
} 
} 
public function onText(text:String):void { 
ExternalInterface.call(this.handlers+".onData",this.movieName,text); 
} 
public function writeBytes(bytes:ByteArray):void { 
this.socketBuffer.position = this.socketBuffer.length; 
this.socketBuffer.writeBytes(bytes,0,bytes.length); 
this.debug("buffer数据:"+this.socketBuffer.length); 
this.readOnData(); 
} 
public var is_head:Boolean = true; 
public var header:ByteArray = new ByteArray(); 
public var headers:Array = new Array(); 
public function onSocketData(e:Event):void { 
var bytes:ByteArray = new ByteArray(); 
if(this.is_head) { 
while(this.socket.bytesAvailable) { 
var x:Number = this.socket.readUnsignedByte(); 
if(x==0x81) { 
this.is_head = false; 
bytes.writeByte(0x81); 
this.debug(this.headers); 
break; 
} else { 
this.header.writeByte(x); 
if(x==10) { 
this.header.position = 0; 
this.headers.push(this.header.readUTFBytes(this.header.length)); 
if(this.header.length==2) { 
this.onTrueConnect(); 
} 
this.header = new ByteArray(); 
} 
continue; 
} 
} 
if(this.socket.bytesAvailable) { 
this.socket.readBytes(bytes,1,this.socket.bytesAvailable); 
} 
} else { 
this.socket.readBytes(bytes,0,this.socket.bytesAvailable); 
} 
bytes.position = 0; 
this.writeBytes(bytes); 
} 
public function sendData(text:String):void { 
var head:ByteArray = new ByteArray(); 
head.writeByte(0x81); 
var body:ByteArray = new ByteArray(); 
body.writeUTFBytes(text); 
var len:Number = body.length; 
if(len<=125) { 
head.writeByte(len); 
} else if(len<65536){ 
head.writeByte(126); 
head.writeShort(len); 
} else { 
head.writeByte(127); 
head.writeUnsignedInt(len); 
} 
body.position = 0; 
head.position = 0; 
this.socket.writeBytes(head); 
this.socket.writeBytes(body); 
this.socket.flush(); 
} 
public function debug(str:*):void { 
if(this.isDebug) { 
ExternalInterface.call(this.handlers+".debug",this.movieName,str); 
} 
} 
} 
}

js代码如下
var handlers = { 
'connects':[], 
'onClose':function(index,flag) { 
this.connects[index.replace("socket_","")].onClose(); 
}, 
'onConnect':function(index) { 
this.connects[index.replace("socket_","")].onConnect(); 
}, 
'onData':function(index,text) { 
this.connects[index.replace("socket_","")].onData(text); 
}, 
'debug':function(index,str) { 
console.log(str); 
} 
}; 
function socket4ie() { 
this.debug = 0; 
this.init = function() { 
this.index = handlers.connects.length; 
handlers.connects.push(this); 
} 
this.connect = function(domain,port) { 
this.createFlash(domain,port); 
} 
this.createFlash = function(domain,port) { 
var html = '<object id="socket_'+this.index+'" type="application/x-shockwave-flash" data="websocket4ie.swf" width=0 height=0 class="swfupload">\ 
<param name="wmode" value="window">\ 
<param name="movie" value="websocket4ie.swf">\ 
<param name="quality" value="high">\ 
<param name="menu" value="false">\ 
<param name="allowScriptAccess" value="always">\ 
<param name="flashvars" value="movieName=socket_'+this.index+'&handlers=handlers&server='+domain+'&port='+port+'&debug='+this.debug+'"></object>'; 
var div = document.createElement('div'); 
div.id = "flash_"+this.index; 
div.innerHTML = html; 
document.body.appendChild(div); 
} 
this.onClose = function() { 
} 
this.onConnect = function() { 
} 
this.onData = function(text) { 
} 
this.init(); 
}
Javascript 相关文章推荐
破解Session cookie的方法
Jul 28 Javascript
js focus不起作用的解决方法(主要是因为dom元素是否加载完成)
Nov 05 Javascript
jquery ajax return没有返回值的解决方法
Oct 20 Javascript
jquery的ajaxSubmit()异步上传图片并保存表单数据演示代码
Jun 04 Javascript
简单的ajax连接库分享(不用jquery的ajax)
Jan 19 Javascript
html5+javascript制作简易画板附图
Apr 25 Javascript
Javascript技术栈中的四种依赖注入小结
Feb 27 Javascript
Jquery操作cookie记住用户名
Mar 29 Javascript
mongoose中利用populate处理嵌套的方法
May 26 Javascript
JS使用tween.js动画库实现轮播图并且有切换功能
Jul 17 Javascript
select2 ajax 设置默认值,初始值的方法
Aug 09 Javascript
vue 解决computed修改data数据的问题
Nov 06 Javascript
当自定义数据属性为json格式字符串时jQuery的data api问题探讨
Feb 18 #Javascript
jQuery筛选器children()案例详解(图文)
Feb 17 #Javascript
正则表达式搭配js轻松处理json文本方便而老古
Feb 17 #Javascript
jQuery图片播放8款精美插件分享
Feb 17 #Javascript
jQuery性能优化28条建议你值得借鉴
Feb 16 #Javascript
JavaScript调用堆栈及setTimeout使用方法深入剖析
Feb 16 #Javascript
js nextSibling属性和previousSibling属性概述及使用注意
Feb 16 #Javascript
You might like
2020显卡排行榜天梯图 显卡天梯图2020年3月最新版
2020/04/02 数码科技
linux系统下php安装mbstring扩展的二种方法
2014/01/20 PHP
分享一个漂亮的php验证码类
2016/09/29 PHP
理解Javascript_05_原型继承原理
2010/10/13 Javascript
JQuery中$之选择器用法介绍
2011/04/05 Javascript
Javascript跨域请求的4种解决方式
2013/03/17 Javascript
JS+flash实现chrome和ie浏览器下同时可以复制粘贴
2013/09/22 Javascript
js、css、img等浏览器缓存问题的2种解决方案
2013/10/23 Javascript
使图片旋转的3种解决方案
2013/11/21 Javascript
用模版生成HTML的的框架jquery.tmpl使用详解
2015/01/07 Javascript
jQuery实现html元素拖拽
2015/07/21 Javascript
JavaScript处理解析JSON数据过程详解
2015/09/11 Javascript
详解springmvc 接收json对象的两种方式
2016/12/06 Javascript
jQuery使用EasyUi实现三级联动下拉框效果
2017/03/08 Javascript
jQuery实现移动端Tab选项卡效果
2017/03/15 Javascript
简单谈谈vue的过渡动画(推荐)
2017/10/11 Javascript
仿淘宝JSsearch搜索下拉深度用法
2018/01/15 Javascript
详解nodejs通过响应回写的方式渲染页面资源
2018/04/07 NodeJs
Vue项目中使用jsonp抓取跨域数据的方法
2019/11/10 Javascript
JavaScript中变量提升机制示例详解
2019/12/27 Javascript
vant组件中 dialog的确认按钮的回调事件操作
2020/11/04 Javascript
python爬取网站数据保存使用的方法
2013/11/20 Python
python使用PyV8执行javascript代码示例分享
2013/12/04 Python
对Python3.x版本print函数左右对齐详解
2018/12/22 Python
python tkinter GUI绘制,以及点击更新显示图片代码
2020/03/14 Python
Python爬虫工具requests-html使用解析
2020/04/29 Python
keras自动编码器实现系列之卷积自动编码器操作
2020/07/03 Python
详解H5本地储存Web Storage
2017/07/03 HTML / CSS
巴西最大的家电和百货零售商:Casas Bahia
2016/11/22 全球购物
优秀村官事迹材料
2014/01/10 职场文书
暖通工程师岗位职责
2014/06/12 职场文书
学习十八大的心得体会
2014/09/01 职场文书
承诺保证书格式
2015/02/28 职场文书
无犯罪记录证明样本
2015/06/16 职场文书
来探秘“德国中小企业”的成功之道
2019/07/26 职场文书
纯CSS3实现div按照顺序出入效果
2021/07/15 HTML / CSS