vue3.0 使用原生websocket通信
本来想使用socket.io-client插件的,但是实操后发现不行,只有另寻他法,最后使用了原生的websoket。1、首先在setup中初始化let socket = null。2、然后在onMounted生命周期里面创建websocket实例代码如下。3、最后别忘记销毁websoket旨在分享~~~~~~.........
·
本来想使用socket.io-client插件的,但是实操后发现不行,只有另寻他法,最后使用了原生的websoket。
1、首先在setup中初始化let socket = null。
2、然后在onMounted生命周期里面创建websocket实例代码如下。
// Websoket连接成功事件
const websocketonopen = (res: any) => {
console.log("WebSocket连接成功", res);
};
// Websoket接收消息事件
const websocketonmessage = (res: any) => {
console.log("数据", res);
};
// Websoket连接错误事件
const websocketonerror = (res: any) => {
console.log("连接错误", res);
};
// Websoket断开事件
const websocketclose = (res: any) => {
console.log("断开连接", res);
};
onMounted(() => {
// 创建 websocket 的实例
const wsurl = "ws://*****";
socket = new WebSocket(wsurl);
socket.onopen = websocketonopen;
socket.onmessage = websocketonmessage;
socket.onerror = websocketonerror;
socket.onclose = websocketclose;
});
3、最后别忘记销毁websoket
// 组件被销毁之前,清空 sock 对象
onBeforeUnmount(() => {
// 关闭连接
websocketclose;
// 销毁 websocket 实例对象
socket = null;
});
旨在分享~~~~~~
更多推荐
已为社区贡献9条内容
所有评论(0)