标题: HTTP/HTTPS js连接 WebSocket服务器
问题:
公司服务器更换成https后WebSocket连接报错
解决
1、js(obj是我要传递的参数…protocol 表示得到的url)
var reg = /.*(https).*/;
let protocol = reg.test(location.protocol) ? 'wss://' + window.location.host + '/websocket/' + obj
: 'ws://' + window.location.host + '/websocket/' + obj
2、同时附上WebSocket心跳包
function WebSocket(options) {
var lockReconnect = false; //避免重复连接
var headbeat_str = ""; //心跳字符串
var ws = {}
var base_fn = {
heartCheck: {
timeout: 60000, //60秒
timeoutObj: null,
serverTimeoutObj: null,
reset: function() {
clearTimeout(this.timeoutObj);
clearTimeout(this.serverTimeoutObj);
return this;
},
start: function() {
var self = this;
this.timeoutObj = setTimeout(function() {
//这里发送一个心跳,后端收到后,返回一个心跳消息,
//onmessage拿到返回的心跳就说明连接正常
ws.send(headbeat_str);
self.serverTimeoutObj = setTimeout(function() { //如果超过一定时间还没重置,说明后端主动断开了
ws.close(); //如果onclose会执行reconnect,我们执行ws.close()就行了.如果直接执行reconnect 会触发onclose导致重连两次
}, self.timeout)
}, this.timeout)
}
},
createWebSocket: function() {
try {
//创建websocket实例
ws = new WebSocket(options.wsUrl);
ws.onopen = function(m) {
//心跳检测重置
base_fn.heartCheck.reset().start();
};
ws.onmessage = function(m) {
//如果获取到消息,心跳检测重置
//拿到任何消息都说明当前连接是正常的
base_fn.heartCheck.reset().start();
//消息回调
if (m.data != headbeat_str) {
options.onmessage(m.data);
}
};
ws.onerror = function(m) {
// options.onerror(m);
base_fn.reconnect();
};
ws.onclose = function(m) {
// options.onclose(m);
base_fn.reconnect();
};
} catch (exception) {
console.log(exception);
}
},
reconnect: function() {
if (lockReconnect) return;
lockReconnect = true;
//没连接上会一直重连,设置延迟避免请求过多
setTimeout(function() {
base_fn.createWebSocket();
lockReconnect = false;
}, 5000);
}
};
base_fn.createWebSocket();
3、使用:
new WebSocket({
wsUrl: protocol,
onmessage: function (data) {
var coindata = JSON.parse(data);
}
});
最后
后台就不写了!!!如果http连接成功的其他都没有问题,https 连接socket就是ws改成wss,我是判断了当前使用的http还是https