Vue+WebSocket 实现页面实时刷新长连接（项目实战）

initWebSocket(){　　
    const wsuri = 'ws://xxxxxxxxxxx';//ws地址
    //注册实例
    this.websock = new WebSocket(wsuri); 
    //WebSocket连接成功
    this.websock.onopen = this.websocketonopen;
    //WebSocket连接发生错误
    this.websock.onerror = this.websocketonerror;
    //数据接收 
    this.websock.onmessage = this.websocketonmessage; 
    //关闭 
    this.websock.onclose = this.websocketclose;
    //这个是我为了全局使用  使用的vuex设置为全局的
    this.$store.state.websock = this.websock
}, 

websocketonopen() {
    console.log("WebSocket连接成功");
    this.btnxx()
},
websocketonerror(e) { //错误
    console.log("WebSocket连接发生错误");
},
websocketonmessage(e){ //数据接收 
    const redata = JSON.parse(e.data);
    //注意：长连接我们是后台直接1秒推送一条数据， 
    //但是点击某个列表时，会发送给后台一个标识，后台根据此标识返回相对应的数据，
    //这个时候数据就只能从一个出口出，所以让后台加了一个键，例如键为1时，是每隔1秒推送的数据，为2时是发送标识后再推送的数据，以作区分
    // console.log(redata); 
}, 
websocketsend(agentData){//数据发送 
    this.websock.send(agentData); 
}, 
websocketclose(e){ //关闭 
    console.log("socket已经关闭")
},

//我是开始直接注册   连接   看个人需求
created(){
    this.initWebSocket()
},

//关闭websock连接   
// this.websock.close();
// this.$store.state.websock.close();

btnxx(){
    let a = {}
    a.type = xxxxxxxxxxxxxxxx
    a.content = JSON.stringify(xxxxxxxxxxxx)
    let b = JSON.stringify(a)
    this.websocketsend(b)
},