原理和vue使用是一样的,这里就不多说了,可以去看我之前发的 websocket 的使用
传送门:
直接看代码:
data() {
return {
socketTask: '',
...
}
},
methods: {
connectSocketInit(mid){
// 创建一个this.socketTask对象【发送、接收、关闭socket都由这个对象操作】
this.socketTask = uni.connectSocket({
url: `wss://ws的地址`,
success(data) {
console.log("websocket连接成功lolo ");
},
});
}
onOpen
事件),将发送一条JSON格式的消息给服务器。connectSocketInit(mid) {
...
var prmsg = `更具自己项目需要绑定发送的数据`;
this.socketTask.onOpen((res) => { //发送消息
this.socketTask.send({
data: prmsg,
});
})
}
onMessage
监听器来接收从服务器发来的消息。connectSocketInit(mid) {
this.socketTask.onOpen((res) => { //发送消息
...
this.socketTask.onMessage((res) => {
let evtObj = JSON.parse(res.data);
console.log('ws推送', evtObj)
})
}}
}
onClose
监听器来处理连接关闭的情况,当连接关闭时会在控制台输出 "ws已经被关闭"。connectSocketInit(mid) {
...
// socket关闭执行
this.socketTask.onClose(() => {
console.log("ws已经被关闭")
})
},
closeSocket() { //关闭链接
this.socketTask.close({
success(res) {
console.log("关闭成功", res)
},
fail(err) {
console.log("关闭失败", err)
}
})
},
注意:
closeSocket()
来释放资源。这样 uniapp 中 webSocket 就能使用了,其他可参照官网进行开发