webSocket通用对象封装
项目中很多用到webSocket与硬件对接,为此封装通用工具
1.websocket四大基础事件
2.扩展心跳检测与断线重连功能
3.核心对象封装,生成与销毁不需要客户端控制
function sesWebSocket(wsurl) {
this.connectURL = wsurl || "";
this.time = 5000;//心跳时间
this.heartMsg = ""; //心跳发送内容
this.timeoutObj =null;
this.serverTimeoutObj =null;
this.reconnectTime =null;
this.isDestroy = false;
this.onopen= function(event) {
// 自定义WSC连接事件:服务端与前端连接成功后触发
console.log(event)
};
this.onmessage= function(event) {
// 自定义WSC消息接收事件:服务端向前端发送消息时触发
console.log(event)
};
this.onerror= function(event) {
// 自定义WSC异常事件:WSC报错后触发
console.log(event)
};
this.onclose= function(event) {
// 自定义WSC关闭事件:WSC关闭后触发
console.log(event)
};
this.webSocketObj = new WebSocket(wsurl);
}
sesWebSocket.fn = sesWebSocket.prototype = {
create : function(obj) {
if(obj){
$.extend(true, this, obj);
}
var websocket = this.webSocketObj;
var currentThis = this;
websocket.onopen = function(evnt) {
currentThis.onopen(evnt);
};
websocket.onmessage = function(evnt) {
currentThis.onmessage(evnt);
};
websocket.onerror = function(evnt) {
currentThis.onerror(evnt);
};
websocket.onclose = function(evnt) {
currentThis.onclose(evnt);
currentThis.aaa();
};
this.reconnectTime = currentThis.reconnectTime;
},
aaa:function(){
if(!this.isDestroy){
this.isDestroy = true;
this.webSocketObj.close();
var c = this;
this.reconnectTime=setTimeout(function(){
c.reconnect();
},c.time)
}
},
destroy : function() {
clearTimeout(this.timeoutObj);
clearTimeout(this.serverTimeoutObj);
clearTimeout(this.reconnectTime);
this.isDestroy = true;
this.webSocketObj.close();
},
heartStart : function(time, msg) {
if (this.webSocketObj.readyState != 1) {
return false;
}
if(time){
this.time = time;
}
if(msg){
this.heartMsg = msg;
}
var self = this;
this.timeoutObj = setTimeout(function() {
self.webSocketObj.send(msg);
self.serverTimeoutObj = setTimeout(function() {
self.reconnect();
}, self.time)
}, this.time);
this.serverTimeoutObj = self.serverTimeoutObj;
},
heartReset: function(){
clearTimeout(this.timeoutObj);
clearTimeout(this.serverTimeoutObj);
var time = this.time;
var msg = this.heartMsg;
this.heartStart(time,msg);
},
reconnect : function() {
if(this.timeoutObj){
clearTimeout(this.timeoutObj);
clearTimeout(this.serverTimeoutObj);
}
var wsurl= this.connectURL;
this.webSocketObj = new WebSocket(wsurl);
this.isDestroy = false;
this.create();
},
}
var $sesWebSocket = function(wsurl) {
return new sesWebSocket(wsurl);
}
sesWebSocket.export = function(fn) {
jQuery.extend(sesWebSocket.prototype, fn);
}
//jsp页面代码
var url = "ws://127.0.0.1:8888";
var wsobj = $sesWebSocket(url);
var opt ={
onopen:function(event){
wsobj.webSocketObj.send("ws send message");
wsobj.heartStart(5000,'heart send message');
},
onmessage:function(event){
wsobj.heartReset();
}
}
wsobj.create(opt);
var url2 = "ws://192.168.126.11:8888";
var wsobj2 = $sesWebSocket(url2);
var opt2 ={
onopen:function(event){
wsobj2.webSocketObj.send("ws send message");
wsobj2.heartStart(5000,'heart send message');
},
onmessage:function(event){
wsobj2.heartReset();
}
}
wsobj2.create(opt2);
本文介绍了一种WebSocket封装方法,包括基本事件处理、心跳检测及断线重连功能。通过封装,开发者可以轻松实现与硬件的稳定通信。
999

被折叠的 条评论
为什么被折叠?



