uniapp websocket心跳重连

<script>
export default {
	data() {
		return {
			timeout: 30000, // 30s
			timeoutObj: null
		};
	},
	onLoad() {
		// .判断是否已连接
		this.checkOpenSocket();
	},
	methods: {
		// 判断是否已连接
		checkOpenSocket() {
			uni.sendSocketMessage({
				data: 'ping',
				success: res => {
					return;
				},
				fail: err => {
					// 未连接打开websocket连接
					this.openConnection();
				}
			});
		},
		openConnection() {
			// 打开连接
			// uni.closeSocket(); // 确保已经关闭后再重新打开
			uni.connectSocket({
				url: 'ws:........',
				success(res) {
					console.log('连接成功 connectSocket=', res);
				},
				fail(err) {
					console.log('连接失败 connectSocket=', err);
				}
			});
			uni.onSocketOpen(res => {
				console.log('连接成功');
			});
			this.onSocketMessage(); // 打开成功监听服务器返回的消息
		},
		//	打开成功监听服务器返回的消息
		onSocketMessage() {
			// 消息
			this.timeout = 30000;
			this.timeoutObj = null;
			uni.onSocketMessage(res => {
				console.log(res)
				this.getSocketMsg(res.data); // 监听到有新服务器消息
			});
		},
		// 监听到有新服务器消息
		getSocketMsg(reData) {
			// 监听到服务器消息
			console.log('收到服务器消息', reData);
			this.reset();  // 检测心跳reset,防止长时间连接导致连接关闭
		},
		// 检测心跳reset
		reset() {
			clearInterval(this.timeoutObj);
			this.start(); // 启动心跳
		},
		// 启动心跳 start
		start() {
			this.timeoutObj = setInterval(function() {
				uni.sendSocketMessage({
					data: 'ping',
					success: res => {
						console.log('连接中....');
					},
					fail: err => {
						console.log('连接失败重新连接....');
						this.openConnection();
					}
				});
			}, this.timeout);
		}
	}
};
</script>
  • 1
    点赞
  • 17
    收藏
    觉得还不错? 一键收藏
  • 5
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值