diff --git a/common/js/websocket.js b/common/js/websocket.js index e222569..99cf73e 100644 --- a/common/js/websocket.js +++ b/common/js/websocket.js @@ -1,148 +1,146 @@ class webSocketUtils { - constructor(url, time, params) { - this.socketTask = null; - this.is_open_socket = false; //避免重复连接 - this.url = url; - this.params = params ? params : null;////是否初始化请求 - this.connectNum = 1; // 重连次数 - //这个参数是防止重连失败之后onClose方法会重复执行reconnect方法，导致重连定时器出问题 - //连接并打开之后可重连，且只执行重连方法一次 - this.canReconnect = false; // 是否可以重连 - //心跳检测 - this.timeout = time ? time : 5000; //多少秒执行检测 - this.heartbeatInterval = null; //检测服务器端是否还活着 - this.reconnectTimeOut = null; //重连之后多久再次重连 - try { - return this.connectSocketInit({ - data: this.params, - type: 'connectSocketInit', - }); - } catch (e) { - console.log('catch'); - this.reconnect(); - } - } - // 进入这个页面的时候创建websocket连接【整个页面随时使用】 - connectSocketInit (data) { - console.log(data,"初始化") - this.data = data; - console.log('this.url==', this.url); - this.socketTask = uni.connectSocket({ - url: this.url, - success: () => { - console.log('正准备建立websocket中...'); - // uni.hideLoading(); - // 返回实例 - return this.socketTask; - }, - }); - console.log('this.params==', this.params); - this.socketTask.onOpen((res) => { - this.connectNum = 1; - console.log('WebSocket连接正常！'); - if(this.params){//是否初始化请求 - this.send(this.params); - } - - clearInterval(this.reconnectTimeOut); - clearInterval(this.heartbeatInterval); - this.is_open_socket = true; - this.canReconnect = true; - this.start(); - // 注：只有连接正常打开中 ，才能正常收到消息 - this.socketTask.onMessage((e) => { - // 字符串转json - let res = JSON.parse(e.data); - uni.$emit('message', res) - // 普通socket信息处理 TODO - - }); - }); - // 监听连接失败，这里代码我注释掉的原因是因为如果服务器关闭后，和下面的onclose方法一起发起重连操作，这样会导致重复连接 - uni.onSocketError((res) => { - console.log('网络断开，请检查！'); - this.socketTask = null; - this.is_open_socket = false; - this.canReconnect = true; - clearInterval(this.heartbeatInterval); - clearInterval(this.reconnectTimeOut); - if (this.connectNum <= 10) { - uni.showToast({ - title: `网络连接失败，正尝试第${this.connectNum}次连接`, - icon: 'none', - }); - this.reconnect(); - this.connectNum += 1; - } else { - // uni.$emit('connectError'); - uni.showToast({ - title: `网络连接失败，请检查网络！`, - icon: 'none', - }); - this.connectNum = 1; - this.canReconnect = false; - } - }); - // 这里仅是事件监听【如果socket关闭了会执行】 - this.socketTask.onClose(() => { - this.socketTask = null; - clearInterval(this.heartbeatInterval); - clearInterval(this.reconnectTimeOut); - - this.is_open_socket = false; - if (this.canReconnect) { - this.reconnect(); - this.canReconnect = false; - } - }); - } - // 主动关闭socket连接 - Close () { - this.is_open_socket = true; - this.canReconnect = false; - if(this.socketTask){ - this.socketTask.close({ - success(res) { - console.log('手动关闭成功'); - }, - }); - } - } - //发送消息 - send(data) { - console.log("发送消息---------->", data); - // 注：只有连接正常打开中 ，才能正常成功发送消息 - if (this.socketTask) { - this.socketTask.send({ - data: JSON.stringify(data), - async success() { - console.log("消息发送成功"); - }, - }); - } - } - //开启心跳检测 - start(data) { - console.log('开启心跳检测',data) - this.heartbeatInterval = setInterval(() => { - this.send({ - data: '心跳检测', - type: 'heartbeat', - }); - }, this.timeout); - } - //重新连接 - reconnect() { - //停止发送心跳 - clearInterval(this.heartbeatInterval); - //如果不是人为关闭的话，进行重连 - if (!this.is_open_socket) { - console.log('进行重连'); - // this.canReconnect = true; - this.reconnectTimeOut = setInterval(() => { - this.connectSocketInit(this.data); - }, this.timeout); - } - } + constructor(url, time, params) { + this.socketTask = null; + this.is_open_socket = false; //避免重复连接 + this.url = url; + this.params = params ? params : null; ////是否初始化请求 + this.connectNum = 1; // 重连次数 + //这个参数是防止重连失败之后onClose方法会重复执行reconnect方法，导致重连定时器出问题 + //连接并打开之后可重连，且只执行重连方法一次 + this.canReconnect = false; // 是否可以重连 + //心跳检测 + this.timeout = time ? time : 5000; //多少秒执行检测 + this.heartbeatInterval = null; //检测服务器端是否还活着 + this.reconnectTimeOut = null; //重连之后多久再次重连 + try { + return this.connectSocketInit({ + data: this.params, + type: 'connectSocketInit', + }); + } catch (e) { + console.log('catch'); + this.reconnect(); + } + } + // 进入这个页面的时候创建websocket连接【整个页面随时使用】 + connectSocketInit(data) { + this.data = data; + this.socketTask ? this.socketTask.Close() : null + this.socketTask = uni.connectSocket({ + url: this.url, + success: () => { + console.log('正准备建立websocket中...'); + // uni.hideLoading(); + // 返回实例 + return this.socketTask; + }, + }); + this.socketTask.onOpen((res) => { + this.connectNum = 1; + console.log('WebSocket连接正常！'); + if (this.params) { //是否初始化请求 + this.send(this.params); + } + + clearInterval(this.reconnectTimeOut); + clearInterval(this.heartbeatInterval); + this.is_open_socket = true; + this.canReconnect = true; + this.start(); + // 注：只有连接正常打开中 ，才能正常收到消息 + this.socketTask.onMessage((e) => { + // 字符串转json + let res = JSON.parse(e.data); + uni.$emit('message', res) + // 普通socket信息处理 TODO + + }); + }); + // 监听连接失败，这里代码我注释掉的原因是因为如果服务器关闭后，和下面的onclose方法一起发起重连操作，这样会导致重复连接 + uni.onSocketError((res) => { + console.log('网络断开，请检查！'); + this.socketTask = null; + this.is_open_socket = false; + this.canReconnect = true; + clearInterval(this.heartbeatInterval); + clearInterval(this.reconnectTimeOut); + if (this.connectNum <= 10) { + uni.showToast({ + title: `网络连接失败，正尝试第${this.connectNum}次连接`, + icon: 'none', + }); + this.reconnect(); + this.connectNum += 1; + } else { + // uni.$emit('connectError'); + uni.showToast({ + title: `网络连接失败，请检查网络！`, + icon: 'none', + }); + this.connectNum = 1; + this.canReconnect = false; + } + }); + // 这里仅是事件监听【如果socket关闭了会执行】 + this.socketTask.onClose(() => { + this.socketTask = null; + clearInterval(this.heartbeatInterval); + clearInterval(this.reconnectTimeOut); + + this.is_open_socket = false; + if (this.canReconnect) { + this.reconnect(); + this.canReconnect = false; + } + }); + } + // 主动关闭socket连接 + Close() { + this.is_open_socket = true; + this.canReconnect = false; + if (this.socketTask) { + this.socketTask.close({ + success(res) { + console.log('手动关闭成功'); + }, + }); + } + } + //发送消息 + send(data) { + console.log("发送消息---------->", data); + // 注：只有连接正常打开中 ，才能正常成功发送消息 + if (this.socketTask) { + this.socketTask.send({ + data: JSON.stringify(data), + async success() { + console.log("消息发送成功"); + }, + }); + } + } + //开启心跳检测 + start(data) { + console.log('开启心跳检测', data) + this.heartbeatInterval = setInterval(() => { + this.send({ + data: '心跳检测', + type: 'heartbeat', + }); + }, this.timeout); + } + //重新连接 + reconnect() { + //停止发送心跳 + clearInterval(this.heartbeatInterval); + //如果不是人为关闭的话，进行重连 + if (!this.is_open_socket) { + console.log('进行重连'); + this.canReconnect = true; + this.reconnectTimeOut = setInterval(() => { + this.connectSocketInit(this.data); + }, this.timeout); + } + } } module.exports = webSocketUtils; \ No newline at end of file diff --git a/pages/order_food/order_food.vue b/pages/order_food/order_food.vue index 2e0827d..1438e60 100644 --- a/pages/order_food/order_food.vue +++ b/pages/order_food/order_food.vue @@ -283,42 +283,32 @@ uni.reLaunch({ url: '/pages/login/login?types=' + 0 }); + return false } uni.$on('message', this.getMessage) + setTimeout(() => { + if (uni.cache.get('token') && uni.cache.get('tableCode')) { + this.productqueryShopIdByTableCode() //获取shop User id + } + }, 500) this.$nextTick(() => { this.countTitleTopNum(); //导航栏 }); }, onUnload() { - this.socketSendMsg({ //定义socket数据传参 - "type": "close", //“addcart:添加购物车，create0rder:生成订单，clearCart:庆康购物车”， - }) - console.log(this.socketTicket, '关闭长连接') + try { + this.socketSendMsg({ //定义socket数据传参 + "type": "close", //“addcart:添加购物车，create0rder:生成订单，clearCart:庆康购物车”， + }) + } catch (e) { + //TODO handle the exception + } this.socketTicket.Close() uni.$off('message') }, onShow() { - // console.log(this.socketTicket,'进入页面') - // if (this.socketTicket) { - // this.socketTicket.Close() - // uni.$off('message') - // } - // uni.onNetworkStatusChange((res) => { //监听网络状态变化 - // if (!res.isConnected) { - // // 检查网络是否连接 - // } else { - // console.log(res, 111); - // // ...这里写你的业务逻辑 - // } - // }); - // setTimeout() - this.handlemessage() - setTimeout(() => { - console.log('调试1') - if (uni.cache.get('token') && uni.cache.get('tableCode')) { - this.productqueryShopIdByTableCode() //获取shop User id - } - }, 500) + + }, methods: { // 单独获取他的shopUserid @@ -337,16 +327,6 @@ uni.pro.switchTab('index/index') }, 1000) } - // try { - // if (res.data) { - // let time = new Date - // console.log(time, '时间戳') - // uni.cache.set('shopUser', res.data) - // this.handlemessage() - // } - // } catch (e) { - // //TODO handle the exception - // } }, getMessage(msg) { //wss 回显数据 if (msg.status != 'success') { @@ -432,17 +412,12 @@ }, handlemessage() { this.socketTicket ? this.socketTicket.Close() : null //调用前先判断是否有socket正在进行 先关闭后链接 - // this.socketTicket = new webSocketUtils( - // `${uni.conf.baseUrlwws}/websocket/table?tableId=${uni.cache.get('tableCode')}&shopId=${uni.cache.get('shopUser')}&userId=${uni.cache.get('userInfo').id}`, - // 5000) - this.socketTicket = new webSocketUtils( - `${uni.conf.baseUrlwws}`, - 5000, { - tableId: uni.cache.get('tableCode'), - shopId: uni.cache.get('shopUser'), - userId: uni.cache.get('userInfo').id, - "type": "connect", - }) + this.socketTicket = new webSocketUtils(`${uni.conf.baseUrlwws}`, 5000, { + tableId: uni.cache.get('tableCode'), + shopId: uni.cache.get('shopUser'), + userId: uni.cache.get('userInfo').id, + "type": "connect", + }) }, // 数据处理 socketSendMsg(data) { @@ -499,7 +474,7 @@ }, async cartadd(item, index, index1, a, b, guge) { //列表添加 console.log(item, index, index1, a, b, guge) - + if (guge == '单规格') { //没有规格为空 this.specifications.duoguge = '' this.skuidname = [] @@ -665,6 +640,7 @@ switch (t) { case 1: // 返回 + this.socketTicket.Close() uni.switchTab({ url: '/pages/index/index' })