uniapp websocket连接 心跳机制

该代码段展示了在uni-app中实现WebSocket连接的管理,包括检查连接状态、打开连接、发送心跳检测、处理连接失败后的重连以及接收服务器消息的逻辑。通过心跳检测保持连接活跃,并在连接断开时尝试重新建立连接。
摘要由CSDN通过智能技术生成
        // 站内信
		// 判断是否已连接
		checkOpenSocket () {
		 let that = this;
		 uni.sendSocketMessage({
		  data: 'heartCheck',
		   success: (res) => {
		   return;
		  },
		  fail: (err) => { // 未连接打开websocket连接
		   that.openConnection(); 
		   console.log('未连接打开websocket连接',err);
		  }
		 });
		},
		openConnection () { // 打开连接
		 uni.closeSocket(); // 确保已经关闭后再重新打开
		 uni.connectSocket({
		  url: SOCKTURL,  // url 填写自己的websocket地址
		  success(res) {
		   console.log('连接成功 connectSocket=', res);
		  },
		  fail(err) {
		   console.log('连接失败 connectSocket=', err);
		  }
		 });
		 uni.onSocketOpen((res) => {
			 uni.sendSocketMessage({
				data: JSON.stringify({
					userCode: uni.getStorageSync('userCode')
				}),
				success: (res) => {
					console.log('第一次发送成功', res);
					// that.openConnection();
				},
				fail: (err) => {
					console.log('第一次发送失败', err);
					that.reconnect();
				}
			});
		  console.log('连接成功', res);
		 });
		 this.onSocketMessage(); // 打开成功监听服务器返回的消息
		},
		// 打开成功监听服务器返回的消息
		onSocketMessage () { // 消息
		 var that = this
		 this.timeout = 1000 * 8;
		 this.timeoutObj = null;
		 uni.onSocketMessage((msg) => {
		  console.log('res',msg.data);
		  // 写自己的逻辑 。。。 
		  this.reset();  // 检测心跳reset,防止长时间连接导致连接关闭
		 })
		},
		// 检测心跳reset
		reset () {
		 clearInterval(this.timeoutObj);
		 this.start(); // 启动心跳
		},
		// 启动心跳 start 
		start () {
		 let that = this;
		 this.timeoutObj = setInterval(function(){
		  uni.sendSocketMessage({
		   data: 'heartCheck',
		    success: (res) => {
		    console.log('连接中....',res);
		    // that.openConnection();
		   },
		   fail: (err) => {
		    console.log('连接失败重新连接....');
		    // that.reconnect();
		    that.openConnection();
		   }
		  });
		 }, this.timeout);
		},
timeout: 8 * 1000, // 心跳检测时间
timeoutObj:null,

调用   this.checkOpenSocket()

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值