一个通用的websocket封装实例，包括Api的回调，消息发送，连接关闭。连接出错重连，重连次数限制，重连超时停止操作等
/**
*
* @param {配置} originalConfig
*/
var wbst = /** @class */ (function (window) {
//重连开始时间
var reConnectBeginTime;
//重连计数
var reConnectNum = 1;
//重连次数限定
var limitReConnectNum = 3;
//重连timer
var reConnectTimer;
// 构造函数
function websocket(originalConfig) {
/**
* originalConfig
* url string //链接的url
* host string //主机名 有url则不传，url需要有主机名
* protocols string //链接使用的协议 ws wss 默认根据location进行判断 http ws or htps wss
* 有url则不传，url需要有协议
* port string //例 ':8080' 端口号 有url则不传，url需要有端口
* message string //连接成功后默认发送的数据，并且在执行send如果没有传递参数，则默认发送该值
*
* onopen: function () {}, //连接成功后触发发
* onmessage: function () {}, //接收到消息触发
* onclose: function () {}, //关闭后触发
* onbeforeclose:function(){} //关闭之前触发
* onerror: function () {}, //发生错误后触发
*
*/
/**
* Wbst实例 close //关闭连接
* send //发送消息
*/
//默认配置参数
var defaultConfig = {
protocol: location.protocol == 'http:' ? 'ws:' : 'wss:',
port: location.port,
ws: null,
timeout: 5000,
onopen: function () { },
onmessage: function () { },
onclose: function () { },
onerror: function () { },
onbeforeclose: function () { }
}
//主机名
var host = location.hostName;
//路径
var pathName = location.pathname;
//是否心跳状态，为false不可操作，等待重连
this.isHeartFlat = false;
//重连状态
this.isReconnect = false;
originalConfig ?
this.config = Object.assign({}, defaultConfig, originalConfig) :
this.config = defaultConfig;
this.config.protocol.indexOf(':') == -1 ? config.protocol += ':' : '';
//如果没有定义url，则拼接url
if (typeof this.config.url == 'undefined') {
this.config.url = this.config.protocol + "http://" + host + ":" + this.config.port + pathName;
}
//发送消息函数
this.send = function (message) {
if (!this.ws) {
console.error("websocket链接已关闭", this);
return;
}
//如果没有传值，则默认发送配置的默认消息
if (typeof message == 'undefined' && typeof this.config.message != 'undefined') {
message = this.config.message;
}
//判断心跳检测，连接是否存在或已连接
if (!this.isHeartFlat) {
// console.error("websocket未连接或出现故障或已断开，正在重新发送...");
var _self = this;
// var timeout = setTimeout(function () {}, 0);
var timeout = setTimeout(function () {
var interval = setInterval(function () {
if (_self.ws.readyState === 1) {
clearTimeout(timeout);
clearInterval(interval);
timeout = null;
interval = null;
_self.send(message);
// console.log("websocket已发送请求");
} else {
clearTimeout(timeout);
clearInterval(interval);
console.error("websocket链接异常", this);
}
}, 100);
}, 0);
return;
} else {
this.ws.send(message);
}
}
//关闭连接
this.close = function () {
if (!this.ws) {
console.error("链接已关闭");
return;
}
this.config.onbeforeclose(this.config, this.ws);
this.ws.close();
}
this.init();
}
//初始化
websocket.prototype.init = function () {
var _self = this;
window.WebSocket = window.WebSocket || window.MozWebSocket;
if (!window.WebSocket) {
console.error("浏览器不支持WebSocket");
return;
}
var ws = new WebSocket(this.config.url);
ws.onopen = function (e) {
_self.onopen(e);
};
ws.onmessage = function (e) {
_self.onmessage(e);
};
ws.onclose = function (e) {
_self.onclose(e);
};
ws.onerror = function (e) {
_self.onerror(e);
}
this.ws = ws;
return;
}
//连接成功
websocket.prototype.onopen = function (e) {
this.isHeartFlat = true;
this.config.onopen(e);
if (typeof this.config.message != 'undefined') {
this.ws.send(this.config.message);
}
}
//接收消息回调
websocket.prototype.onmessage = function (e) {
this.config.onmessage(e);
}
//连接出错回调，默认执行重连操作
websocket.prototype.onerror = function (e) {
var _self = this;
//心跳值为false
this.isHeartFlat = false;
this.config.onerror(e);
if (reConnectNum <= limitReConnectNum) {
//开始重连
console.error('WebSocket连接出错，正在重连...');
clearTimeout(reConnectTimer);
reConnectTimer = setTimeout(function () {
if (reConnectNum == 1) {
reConnectBeginTime = new Date();
}
console.log('尝试第' + reConnectNum + '次重连');
_self.isReconnect = true;
_self.reConnect();
//如果心跳值为true，则重连成功
if (_self.isHeartFlat) {
clearTimeout(reConnectTimer);
reConnectTimer = null;
}
}, 2000);
} else {
console.error('重连次数超出设定值，不再重连，请检查配置项');
}
}
//关闭回调
websocket.prototype.onclose = function (e) {
this.isHeartFlat = false;
this.config.onclose(e);
}
//重连操作
websocket.prototype.reConnect = function () {
//如果没有触发重连操作，则不执行
if (!this.isReconnect) return;
//判断重连超时，若超时，则不再重连
if (new Date() - reConnectBeginTime > this.config.timeout) {
console.error("websocket重连超时");
this.isReconnect = false;
//清除重连延时器
clearTimeout(reConnectTimer);
reConnectTimer = null;
return;
}
//开始重连
var _self = this;
//重连计数器
reConnectNum++;
_self.init();
}
return websocket;
}(window, jQuery))
