Vue中websocket在刷新或关闭页面时如何关闭链接
websocket在不用时需要及时关闭,否则会对造成服务端压力思路(错误)将关闭websocket的方法放在beforeDestroy钩子函数中data(){return{ws:"",}},methods:{//关闭websocketcloseWebsocket(){if(this.ws){this.ws.close();let _this=thisthis.ws.onclose = functi
·
- websocket在不用时需要及时关闭,否则会对造成服务端压力
思路(错误)
将关闭websocket的方法放在beforeDestroy钩子函数中
data(){
return{
ws:"",
}
},
methods:{
//关闭websocket
closeWebsocket(){
if(this.ws){
this.ws.close();
let _this=this
this.ws.onclose = function(evt) {
console.log("websocket已关闭");
};
}
}
},
beforeDestroy() {
this.closeWebsocket()
}
但是当刷新页面或者关闭页面的时候,beforeDestroy钩子没有被触发,所以不会执行关闭websocket链接的方法
正确方法
- 借助 onbeforeunload 事件
data(){
return{
ws:"",
}
},
methods:{
//关闭websocket
closeWebsocket(e){
if(this.ws){
this.ws.close();
let _this=this
this.ws.onclose = function(evt) {
console.log("websocket已关闭");
};
}
}
},
created(){
//绑定事件
window.addEventListener('beforeunload', e => this.closeWebsocket(e))
},
beforeDestroy() {
//卸载事件
window.removeEventListener('beforeunload', e => this.closeWebsocket(e))
}
更多推荐
已为社区贡献1条内容
所有评论(0)