1、websocket简介

websocket最主要特点是：服务器可以主动给浏览器发送消息，而不是被动接收浏览器请求。

websock协议可以参考：

2、实现代码

（1）websocket.js

let websock;// 持续连接function connection(wsuri) {  websock = new WebSocket(wsuri);  // 建立连接  websock.onopen = function(e) {    console.log('收到服务器握手包.');    setInterval(function() {      let agentData = {'name': 'ping', 'message': 'message'}      websocketsend(agentData)    }, 30000)  }  // 断开连接  websock.onclose = function(e) {    console.log('和服务器断开连接! (' + e.code + ')');  }  // 连接发生错误  websock.onerror = function() {    console.log('websock连接发生错误');  }}// 业务代码发送数据function sendSock(agentData) {  console.log('agentData', agentData)  // 链接成功，可以通信  if (websock.readyState === websock.OPEN) {    websocketsend(agentData);  } else if (websock.readyState === websock.CONNECTING) {    // 若是正在链接，则等待1s后重新调用    setTimeout(function() {      sendSock(agentData);    }, 1000);  } else {    // 若未开启 ，则等待1s后重新调用    setTimeout(function() {      sendSock(agentData);    }, 1000);  }}// 数据发送function websocketsend(agentData) {  websock.send(JSON.stringify(agentData));}export {connection, sendSock, websock}

（2）业务代码

//注意修改路径import * as websocket from 'websocket.js' //vue mounted时挂在websocketmounted() {    websocket.connection(yourUrl)    // onmessage 用于指定收到服务器数据后的回调函数。    websocket.websock.onmessage = (e) => {     //业务处理    }  }methods：{handleEvent() {//发送数据websocket.sendSock(yourParams)}}

（3）websockt需要服务端配置好服务。