vue websocket长连接

    created() {
      //页面刚进入时开启长连接
      this.initWebSocket();
    },
    destroyed: function () {
      //页面销毁时关闭长连接
      this.websocketclose();
    },
    methods: {
      initWebSocket() { //初始化weosocket
        const wsuri = 'ws://xx.xx.xx.xx:xxxx/websocket';//ws地址
        this.websock = new WebSocket(wsuri);
        this.websock.onopen = this.websocketonopen;
        this.websock.onerror = this.websocketonerror;
        this.websock.onmessage = this.websocketonmessage;
        this.websock.onclose = this.websocketclose;
        // this.websock.addEventListener('open', function () {  //监听
        // });

      },

      websocketonopen(e) {
        this.websock.send('sifinitediff,' + e);// 连接完成后发送信息
      },

      websocketonerror(e) { //错误
        console.log("WebSocket连接发生错误");
      },

      websocketonmessage(e) { //数据接收
        // console.log(e);
        // const redata = JSON.parse(e.data);
        //注意：长连接我们是后台直接1秒推送一条数据，
        //但是点击某个列表时，会发送给后台一个标识，后台根据此标识返回相对应的数据，
        //这个时候数据就只能从一个出口出，所以让后台加了一个键，例如键为1时，是每隔1秒推送的数据，为2时是发送标识后再推送的数据，以作区分

        let data = JSON.parse(e.data);
         console.log(data);

      },

      websocketclose(e) { //关闭

        this.websock.close(); //关闭websock

      },
    }

标签：vue,websocket,log,xx,websock,console,data,连接
来源： https://www.cnblogs.com/luzt/p/14431078.html