uni-app使⽤封装单例websocket类⼼跳检测断开重连落⽹重连即
时通讯
利⽤vuex做页⾯级通讯,利⽤websocket接收监听消息,利⽤http做接⼝交互
其中config是⼀些基本的应⽤配置
ChatModel是封装的⼀些http接⼝
本⽂主要分享的是uni-app websocket封装的类
可以根据⾃⼰的业务拿来改改就能⽤了
import store from '@/store/index.js'
import config from './app_config.js'
import ChatModel from './chatModel.js'
class Chat{
/
/初始化
constructor() {
this.chatModel = new ChatModel();
//⽤户登陆token
this.wsAccessToken = s.wsAccessToken;
//ws地址
this.wsUrl = config.wsUrl + '?access_token=' + this.wsAccessToken;
//websocket对象
this.socketTask = null;
//⼼跳检测
this.heartbeatInterval= null;
/
/⼼跳检测时间
this.heartbeatTimeOut= 5000;
//是否⼈为关闭
this.isPeopleClose = false;
//断线重连机制
//重连时间
//重连次数
//落⽹重连
if(res.isConnected){
}
});
}
//单例模式
static getInstance(){
if(!this.instance){
this.instance = new Chat();
}
return this.instance;
}
//链接并打开
connect(){
try{
this.socketTask = tSocket({
url: this.wsUrl,
success:()=>{
console.log("正在建⽴链接");
return this.socketTask
},
fail:(err)=>{
},
});
//打开链接正常
//打开链接正常
Open(async (res) => {
console.log("打开链接成功");
//获取会话
await SessionToken();
websocket和socket//获取未读消息
await NoReceiveMessageList(); //清除⼼跳and断开重连定时器,
clearInterval(this.heartbeatInterval);
ectInterval);
//设置重连次数
//重置⼈为关闭状态
this.isPeopleClose = false;
//开启⼼跳检测
this.startHeartbeat();
//监听接收消息
Message((res) => {
storemit("setReceiveMessageData", res.data); });
})
Error((err) => {
console.log('onError');
})
Close(() => {
console.log('onClose');
//重连
})
}catch(e){
/
/重连
}
}
//发送消息
sendMsg(value){
this.socketTask.send({
data: value,
async success() {
console.log('⼼跳发送成功')
},
async fail(){
//重连
}
})
}
//⼿动关闭链接
close(){
console.log('close');
this.isPeopleClose = true;
this.socketTask.close({
success(res) {
console.log("⼿动关闭成功")
},
fail(err) {
}
})
}
//⼼跳检测
startHeartbeat(){
this.heartbeatInterval = setInterval(() => {
this.sendMsg('heartbeat');
}, this.heartbeatTimeOut);
}
//断线重连
reconnect(){
//停⽌发送⼼跳
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论