uniapp websocket连接

let params = {
	timeout: 18000,
	timeout2: 22000,
	timeoutObj: null,
	serverTimeoutObj: null,
	lockReconnect: false,
	tt: false,
	maxConnect: 3,
	status: false,
	lockSend: false
}
var num = 3;
var socketTask;
var wsUrl = '132123';
var heartflag = false; //心跳开关
var openflag = false;
var ws = {}
var itemsclear = null
var lsmxs = this

$reconnect(cb, sendData) {
			if (params.lockReconnect || params.maxConnect <= 0 || _data.data("socket_state") > 0) {
				return false;
			}
			_data.data('socket_state', 0);
			clearTimeout(params.timeoutObj);
			clearTimeout(params.serverTimeoutObj);
			uni.closeSocket();
			params.lockReconnect = true;
			params.status = false;
			params.maxConnect--;
			if (sendData != undefined) {
				this.$socketSend(sendData, cb);
			} else {
				this.$sendWithPingToken(cb);
			}
		},
		$sendWithPingToken(cb) {
			this.$socketSend({
				'action': 'ping',
				'data': _data.localData('token')
			}, cb);
		},
		$reset() {
			params.status = false;
			params.lockReconnect = false;
			params.maxConnect = 3;
			params.lockSend = false;
			clearTimeout(params.timeoutObj);
			clearTimeout(params.serverTimeoutObj);
			return this;
		},
		$sendWithToken(cb) {
			if (params.lockSend) {
				return false;
			}
			params.lockSend = true;
			this.$socketSend({
				action: 'checkToken',
				data: _data.localData('token'),
			}, cb);
		},
		$start() {
			if (params.status) {
				return false;
			}
			params.status = true;
			let self = this;
			clearTimeout(params.serverTimeoutObj);
			clearTimeout(params.timeoutObj);
			params.timeoutObj = setTimeout(function() {
				//这里发送一个心跳,后端收到后,返回一个心跳消息,
				//onmessage拿到返回的心跳就说明连接正常
				self.$sendWithPingToken();
				params.serverTimeoutObj = setTimeout(function() { // 如果超过一定时间还没重置,说明后端主动断开了
					uni.closeSocket();; //如果onclose会执行reconnect,我们执行 websocket.close()就行了.如果直接执行 reconnect 会触发onclose导致重连两次
				}, params.timeout2)
			}, params.timeout)
		},
		$socketSend(send_data, cb) {
			let self = this;
			/** callback1是连接,callback2是发送 */
			((callback1, callback2) => {
				if (send_data && _data.data('socket_state')) {
				_data.data('socket_state') 这个是状态
					callback2(send_data);
				} else {
					callback1(callback2, send_data);
				}
			})((callback, send_data) => {
					uni.connectSocket({
						url: _data.data('socket_url'), //这个是连接路径
						header: {
							'content-type': 'application/json',
						},
						// protocols: [ 'protocol1' ],
						method: 'GET',
						success() {
							_data.data('socket_state', 1);
						},
						fail(err) {
							self.$reset().$reconnect();
						}
					});
					uni.onSocketOpen((res) => {
						self.$reset().$start();
						/** 绑定服务器消息事件 */
						uni.onSocketMessage((res) => {
							self.$reset().$start();
							res = JSON.parse(res.data);
							// console.log('收到服务器内容:' + res.data);
							if (!(res.action in _onSocket)) {
								if (res.action != 'ping' && res.type != 'ping' && res.action != 'bindUid') {
									// uni.showModal({
									// 	content: '接受到无效的消息',
									// });
								}
								//保存接收到心跳包的时间
								if (res.type === 'ping') {
									// console.log('123')
									const time = Date.parse(new Date()) / 1000
									// console.log(time)
									_data.localData('socket_heartbeat', time)
								}
								if (res.action === 'bindUid') {
									console.log('连接成功,已绑定UID:' + res.data.user_id);
								}
							} else {
								_onSocket[res.action](res.data);
							}

							return;
							/** 下面的写法二进制接收数据不兼容APP */

							if (res.data instanceof Blob) {
								/** js中的blob没有没有直接读出其数据的方法,通过FileReader来读取相关数据 */
								let reader = new FileReader();
								reader.readAsDataURL(res.data);
								/** 当读取操作成功完成时调用. */
								reader.onload = function(evt) {
									let data = JSON.parse(((str) => {
										/**  base64编码解析 */
										if (str.indexOf(',') > -1) {
											str = str.split(',')[1];
										}
										return decodeURIComponent(atob(str).split('').map((c) => {
											return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2);
										}).join(''));
									})(evt.target.result));
									if (!(data.action in _onSocket)) {
										if (data.action != 'ping') {}
										return;
									}
									_onSocket[data.action](data.data);
								}
							}
						});

						/** 这里发送token到服务器验证 */
						callback({
							action: 'checkToken',
							data: _data.localData('token'),
						});

						/** 这里如果有需要发送的数据,就等待2s再进行发送,如果2s后,token验证还是不合法,就舍弃这次的发送 */
						if (send_data) {
							if (_data.localData('token')) {
								callback(send_data);
							} else {
								callback({
									action: 'checkToken',
									data: _data.localData('token'),
								});
							}
						}

					});

					uni.onSocketClose((err) => {
						_data.data('socket_state', 0);
						params.lockReconnect = false;
						self.$reconnect();
					});

					uni.onSocketError((err) => {
						_data.data('socket_state', 0);
						params.lockReconnect = false;
						self.$reconnect();
					});
				},
				(send_data) => {

					uni.sendSocketMessage({
						data: JSON.stringify(send_data),
						fail(err) {
							return;
							uni.showModal({
								content: JSON.stringify(err) + '---发送消息失败',
							});
						},
						success(res) {
							if (cb != undefined) {
								cb();
							}
						}
					});

					return true;
				});
		},
在这里插入代码片
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 5
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值