导论:以前没用过Websocket的,现在需求用到了才了解到这是一种服务器主动发送数据给客户端的方法,与客户端主动请求的ajax异曲同工。但是Websocket的官方文档提供的参考信息极少,像极了之前我做过的Echarts-X,可能是使用的人少吧。
1、新建一个websocket
let ws = new WebSocket('ws://xxx.xxx.xxx:8000');
2、建立连接(订阅thingsboard为例)
需要请求的参数为一个时,直接传入字符串;为多个时,以逗号分隔。tsSubCmds是获取实时的数据,historyCmds是获取历史数据,需要注意是,历史数据和最新返回的一条实时数据返回的先后顺序是不固定的!所以,需要手动判断一下,看数据返回的长度。
ws.onopen = function () {
var object = {
tsSubCmds: [{
entityType: "DEVICE",
entityId: "123456",
keys: "aa,bb,cc,dd",
scope: "LATEST_TELEMETRY",
cmdId: 25
}],
historyCmds: [{
entityType: "DEVICE",
entityId: "123456",
keys: "aa",
startTs: 1521700888000, // 开始时间
endTs: 1521702888000, // 结束时间
interval: 1000, // 时间间隔
limit: 100, // 限制条数
agg: "AVG"
}]
attrSubCmds: []
};
dataSend = JSON.stringify(object);
ws.send(dataSend);
};
3、拿到数据,进行处理
ws.onmessage = function (event) {
var data = $.parseJSON(event.data).data;
}
4、关闭连接
ws.close()
如果页面上,需要切换设备去动态的获取数据,记得切换设备的时候,把前一个开好的连接关掉,再新开连接,否则之前的连接会跟定时器一样一直存在,会影响性能,甚至导致浏览器崩溃。