基于WebSocket的RTDT传输组件

RTDT的js组件（v1.0）
RTDT（Real-time Data Transport 实时数据传输）组件，基于websocket的实时数据传输组件，
与ajax对比：
跨域：RDTD直接支持跨域，而ajax对跨域并不友好，需要另外对其进行设置
传输：RTDT基于WebSocket，只在握手时进行请求头传输，数据传输过程减少大量额外数据，而ajax每次请求都需要发送请求头，占用宽带更高。
即使性：RTDT支持双向传输，即可以通过常规请求方式，也可以通过服务器直接推送，消息更加及时，而且不浪费服务器和宽带资源。而ajax只能一次一个请求，并且不能进行服务器推送，要实现推送需要不停请求服务器，如果时间间隔比较久则消息不及时，刷新时间太短浪费大量资源可能并不能得到想要的数据。
数据类型：目前RTDT仅支持字符串方式传输，ajax支持Json等更多数据类型
数据长度：RTDT数据限制较小，ajax可以传输大量数据
兼容性：仅支持支持WebSocket的浏览器（IE10，forfix4+等）

/**
* RTDT js框架
* 必须添加配置RTDTConf
* 调用方法
* RTDT.Req({
*action: “testActiond”,
*parameters:”n%E5%BE%97%E5%88%B0me=%E5%97%AF%E5%97%AF&age=&sex=&other=”,
*success:function(data){
*console.log(“get data:”+data)
*},error:function(err){
*console.log(“error:”+err.data)
*}
*})
* 参数说明
* action:调用的action地址
* parameters:序列化的表单数据
* success:当正常返回数据
* error:当错误发生（可能服务器返回错误信息，或者js内部错误）
* 需要其中依赖jquery的extends函数，需要jquery支持
* version: v1.0
* protocol；RTDT 1.0
* by:YaNan 2017-06-22
*/
var action = {
action: null,
namespace: null,
parameters: null,
success:null,
error:null
}
var reqMap = {};
var timeoutTimers = {};
var actionTimers = {};
var webSocket;
var RTDT=RTDT || {};
RTDT = function(){
this.available=false;
this.Req = function(params){
params = $.extend(true, action,params);
var REQAction = {
action:params.action,
namespace:params.namespace,
parameters:params.parameters,
AUID:guid()
}
reqMap[REQAction.AUID]=params;
timeoutTimers[REQAction.AUID] = setTimeout(function(){
clearInterval(actionTimers[REQAction.AUID]);
},RTDTConf.timeout)
actionTimers[REQAction.AUID] = setInterval(function(){
if(RTDT.available){
clearInterval(actionTimers[REQAction.AUID]);
webSocket.send(JSON.stringify(REQAction));
}
},RTDTConf.refresh)
}
this.isAvailable = function(){
return this.available;
}
this.OnResponse=function(data){
try{//需要捕获异常
data = eval(“(“+data.data+”)”);
if(data.AUID==null||data.AUID==undefined)
throw new Error(“protocol error”);
clearTimeout(timeoutTimers[data.AUID]);
if(data.status!=null&&data.status!=undefined&&data.status==4280){
if(typeof reqMap[data.AUID].success==”function”)
reqMap[data.AUID].success.call(this,data.data);
}else{
RTDT.OnError(data.AUID,data)
}
}catch(err){
if(typeof RTDTConf.error == “function”){
RTDTConf.error.call(this,err)
}
}
}
this.OnError = function(AUID,err){
if(typeof reqMap[AUID].error==”function”)
reqMap[AUID].error.call(this,err);
}
};
(function(){
/**
* 检查socket 配置文件是否存在
* @param {Object} event
*/
RTDT = new RTDT();
if(typeof RTDTConf == “undefined”)
throw new Error(“RTDT need RTDT Conf”)
webSocket =new WebSocket(RTDTConf.url);
webSocket.onerror = function(event) {
RTDT.OnError(event);
};
webSocket.onopen = function(event) {
RTDT.available=true;
};
webSocket.onmessage = function(event) {
RTDT.OnResponse(event)
};
webSocket.onclose = function(event){
RTDT.available=false;
};
})();
function guid() {
function S4() {
return (((1+Math.random())*0x10000)|0).toString(16).substring(1);
}
return (S4()+S4()+”-“+S4()+”-“+S4()+”-“+S4()+”-“+S4()+S4()+S4());
}
调用案例：

执行结果：