vue 使用 websocket

var websock = null;
var globalCallback = null;

// 初始化weosocket
function initWebSocket() {
  // ws地址 -->这里是你的请求路径
  // var ws = `ws://192.168.79.185:8089/panan_cs/websocket/${localStorage.getItem('nickname')}`
  // var ws = `ws://61.174.54.120:9000/panan_cs/websocket/${localStorage.getItem('nickname')}`
  // var ws = `ws://192.1.3.139:19001/ws`;
  var ws = `ws://101.89.192.19:19001/ws`;
  websock = new WebSocket(ws);
  websock.onmessage = function (e) {
    console.log("websock.onmessage", e);
    websocketonmessage(e);
  };
  websock.onclose = function (e) {
    websocketclose(e);
  };
  websock.onopen = function () {
    websocketOpen();
  };

  // 连接发生错误的回调方法
  websock.onerror = function () {
    console.log("WebSocket连接发生错误");
  };
}

// 实际调用的方法
function sendSock(agentData, callback) {
  globalCallback = callback;
  if (websock.readyState === websock.OPEN) {
    // 若是ws开启状态
    websocketsend(agentData);
  } else if (websock.readyState === websock.CONNECTING) {
    // 若是 正在开启状态，则等待1s后重新调用
    setTimeout(function () {
      sendSock(agentData, callback);
    }, 1000);
  } else {
    // 若未开启 ，则等待1s后重新调用
    setTimeout(function () {
      sendSock(agentData, callback);
    }, 1000);
  }
}

// 数据接收
function websocketonmessage(e) {
  console.log("websocketonmessage", e);
  globalCallback(JSON.parse(e.data));
}

// 数据发送
function websocketsend(agentData) {
  console.log("agentData", agentData);
  websock.send(JSON.stringify(agentData));
}

// 关闭
function websocketclose(e) {
  console.log("connection closed (" + e.code + ")");
  console.log("connection closed reason (" + e.reason + ")");
  console.log("connection closed wasClean (" + e.wasClean + ")");
  initWebSocket();
}

// 创建 websocket 连接
function websocketOpen(e) {
  console.log("连接成功");
}

initWebSocket();

// 将方法暴露出去
export { sendSock };

method:
 firstConnect(res) {
      console.log("链接成功后：", res);
    },

created:

socketApi.sendSock({}, this.firstConnect);

或者。。。

connectWs() {
      const that = this;
      that.ws = new WebSocket("ws://101.89.192.19:19001/ws");
      that.ws.onopen = function () {
        console.log("websocket 连接");
      };
      that.ws.onmessage = function (e) {
        let data = JSON.parse(e.data);
        console.log("e", data);

        // if (data.picId) {
        //   data.calculationName = that.getCalculationName(data.caculation);
        //   that.dataList.unshift(data);
        //   that.SET_WARNING(data);
        //   const params = {
        //     eventName: data.calculationName,
        //     emergencyLevelId: 20,
        //     alarmContent: `摄像头-${data.cameraName}产品告警：${data.calculationName}`,
        //     pictureUrl: data.picUrl,
        //     lng: 0.0,
        //     lat: 0.0,
        //   };
        //   that.insert(params);
        // }
      };
      that.ws.onclose = function () {
        console.log("websocket 断开连接");
      };
      that.ws.onerror = function () {
        console.log("websocket 连接出错");
      };
    },

调用 

connectWs（）