美文网首页
websocket的注意事项

websocket的注意事项

作者: 焚心123 | 来源:发表于2021-07-16 09:39 被阅读0次
    • 在微信小程序中使用到websocket,同时也遇到了一些问题,特此记录下
    • 使用websocket后,在点击头部的返回按钮或者是点击返回上一页的按钮,此时编辑器会显示一个object的错误,这是关闭了websocket后,可能有进行关闭了一次,此时是个空的对象,所以会进行提示,下面会进行解决的
    • 还有一个问题是,可能是操作的有点频繁,来回连接和关闭websocket,此时编辑器报了一个黄色的警告,说由于操作的频繁,监听卸载页面的生命周期监听的太多了,会导致内存的泄露,这个目前还没有解决
    • 解决编辑器提示object的错误
    • 产生错误的原因上面提到过了,解决的办法就是添加两个变量,判断一下,如果我们请求数据成功之后,关闭了,那么在页面卸载的时候就不用在进行关闭,否则第二次的关闭会产生报错
    • 还有一种可能,就是websocket连接上了,但是有可能信号啥的,在断了,这个时候也需要我们在进行重新连接一下
    // pages/company-Administrator/create-qrcode/create-.js
    const app = getApp();
    let timer,wsReconnectionTimer
    Page({
    
      /**
       * 页面的初始数据
       */
      data: {
        show_refresh:false,//是否显示刷新提示,默认不显示
        show: false,//提示弹框,默认不显示
        qrCodeImg:'',
        face_price:'',
        actId:'',
        goodsId:'',
        memoSend:'',
        nickName:'',
        face_total:'',
        code:'',
        orderNo:'',
        isC:true,//关闭页面的时候不重连
        closeWS:false//是否关闭websocket,默认关闭
      },
      //点击刷新
      refresh_btn(){
        this.setData({
          show_refresh:false
        })
        this.socket_list();//请求,链接
      },
      //点击阴影,关闭弹框
      onClose() {
        this.setData({ show: false });
      },
      //点击继续发放
      confirm(){
        app.throttle(()=>{
          // wx.navigateTo({
          //   url: '/pages/company-Administrator/index/index?show=true'+'&actId='+this.data.actId+'&face_price='+this.data.face_price,
          // })
          wx.navigateBack({
            delta: 1,
          })
        })
       
      },
      //点击返回首页
      cancel(){
        app.throttle(()=>{
          // wx.removeStorageSync('sendCardInfo');
          app.globalData.sendCardInfo = {};
          wx.navigateBack({
            delta: 1,
          })
          // wx.setStorageSync('show', false);
          app.globalData.show_tan = false;
        })
       
      },
      //点击关闭,返回首页
      go_index(){
        // wx.closeSocket();
        wx.navigateBack({
          delta:1
        })
        // wx.setStorageSync('show', false);
        app.globalData.show_tan = false;
        
      },
      /**
       * 生命周期函数--监听页面加载
       */
      onLoad: function (options) {
        wx.hideShareMenu() // 禁止页面转发
        // console.log(options);
        if(options){
          const obj = JSON.parse(options.list);
          console.log(obj);
          this.data.actId = obj.actId;
          this.data.goodsId = obj.goodsId;
          this.data.face_price = obj.face_price
          this.data.memoSend = obj.memoSend
          this.socket_list();
          // wx.setStorageSync('show', true);
          app.globalData.show_tan = true;
        }
      },
      socket_list(){
        app.mp.getUserInfoStorage().then(res=>{
          var userInfo = res;
         
        //获取活动列表
        app.mp.reqSync("f2-f-orderinfo/sendCard",{
          openid:userInfo.openid,
          epid:userInfo.selectEnterprise.epid,
          actId:this.data.actId,
          goodsId:this.data.goodsId,
          memoSend:this.data.memoSend
          },1).then(res=>{
            console.log(res);
          
            if(res.code == '00'){
    
                this.setData({
                  qrCodeImg:"data:image/png;base64,"+res.data.code,
                  face_price:this.data.face_price,
                  code:res.data.code,
                  orderNo:res.data.orderNo
                })
                
               this.is_webSocket(res.data.orderNo)
                
                
            }else{
              app.mpui.myModal(res.msg,'','确定','',()=>{
                // wx.setStorageSync('show', false);
                app.globalData.show_tan = false;
                wx.navigateBack({
                  delta: 1,
                })
              });
              
            }
          }).catch(msg=>{
            console.log(msg);
            
          })
    
        })
      },
      is_webSocket(orderNo){
        wx.connectSocket({
          url:"wss://"+app.globalData.ip+"/weiapp-server/mywebsocket/"+orderNo
          //url:"wss://apptest.zihexin.net:6122/weiapp-server/mywebsocket/"+orderNo
        })
        //监听是否连接上
        wx.onSocketOpen(function (res) {
          console.log('连接上了--------------')
         console.log(res);
    
        })
        //接受服务器发送过来的数据
        wx.onSocketMessage(res=>{
          console.log('接受服务器数据----------')
          console.log(res);
          const data = JSON.parse(res.data);
          //加入成功
          if(data.code =='06'){
            //this.data.isC = false;
            if(wsReconnectionTimer){
              clearTimeout(wsReconnectionTimer);
            }
            this.data.closeWS = true;
          }else if(data.code =='01'){//领取失败
              app.mpui.myModal(data.msg,'','确定','',()=>{
                // wx.setStorageSync('show', true);
                app.globalData.show_tan = true;
                wx.navigateBack({
                  delta: 1,
                })
              })
              this.setData({
                show_refresh:true
              })
              wx.closeSocket();
              this.data.isC = false;
            }else if(data.code == '00'){//领取成功
              this.setData({
                nickName:data.nickName,
                face_total:data.facePrice,
                show:true,
                show_refresh:true
              })
              let obj = {
                actId:this.data.actId,
                show:true
              }
              app.globalData.sendCardInfo = obj;
              // wx.setStorageSync('sendCardInfo', JSON.stringify(obj));
              wx.closeSocket();
              this.data.isC = false;
            }else if (data.code == '09' || data.code =='02'){//时间过期
              this.setData({
                show_refresh:true
              })
              wx.closeSocket();
              this.data.isC = false;
            }else if(data.code == '03'){
              app.mpui.myModal(data.msg,'','确定','',()=>{
                wx.navigateBack({
                  delta: 1,
                })
                // wx.setStorageSync('show', false);
                app.globalData.show_tan = false;
              })
              this.setData({
                show_refresh:true
              })
              wx.closeSocket();
              this.data.isC = false;
            }else if(data.code == '04'){
              console.log(data.msg);
              app.mpui.myModal('发放失败,活动状态有误','','确定','',()=>{
                wx.navigateBack({
                  delta: 1,
                })
                // wx.setStorageSync('show', false);
                app.globalData.show_tan = false;
              })
              this.setData({
                show_refresh:true
              })
              wx.closeSocket();
              this.data.isC = false;
            }else{
              app.mpui.myModal(data.msg,'','确定','',()=>{
                // wx.setStorageSync('show', false);
                app.globalData.show_tan = false;
                wx.navigateBack({
                  delta: 1,
                })
              })
              this.setData({
                show_refresh:true
              })
              wx.closeSocket();
              this.data.isC = false;
            }
          
        })
        //监听关闭
        wx.onSocketClose(res=> {
          console.log('已经关闭了----------')
          console.log(res)
          this.data.closeWS = false;
          //关闭页面的时候就不重连了
          if(this.data.isC){
            console.log(orderNo)
            wsReconnectionTimer = setTimeout(()=>{
              this.is_webSocket(orderNo)
            },5000)
          }
         
        })
        //
        wx.onSocketError(res=>{
          //关闭页面的时候就不重连了
          if(this.data.isC){
            console.log(orderNo)
            wsReconnectionTimer = setTimeout(()=>{
              this.is_webSocket(orderNo)
            },5000)
          }
        })
      },
      status_list(){
        app.mp.getUserInfoStorage().then(res=>{
          var userInfo = res;
        //获取活动列表
        app.mp.reqSync("f2-f-orderinfo/querySendOrder",{
          openid:userInfo.openid,
          epid:userInfo.selectEnterprise.epid,
          actId:this.data.actId,
          orderNo:this.data.orderNo
          },1).then(res=>{
            console.log(res);
           if(res.code ==='00'){
              switch (res.data.status) {
                case '00'://显示发放成功
                  this.setData({
                    nickName:res.data.nickName,
                    face_total:res.data.facePrice,
                    show:true,
                    show_refresh:true
                  })
                  break;
                case '10'://带领取
                
                  break;
                case '02'://已失效
                // clearInterval(timer);
                this.setData({
                  show_refresh:true
                })
                break;
                default:
                  app.mpui.showToast(res.msg)
                  break;
              }
           }else{
    
              // clearInterval(timer);
              app.mpui.showToast(res.msg)
              // app.mpui.myModal(res.msg,'','确定','',()=>{
              //   this.socket_list();
              // });
    
           }
          }).catch(msg=>{
            console.log(msg);
          })
    
        })
      },
      /**
       * 生命周期函数--监听页面隐藏
       */
      onHide: function () {
        
        
      },
    
      /**
       * 生命周期函数--监听页面卸载
       */
      onUnload: function () {
        this.data.isC = false;//不重新连接
        if(this.data.closeWS){//关闭页面的时候,websocket还在连接,那么就进行关闭
          wx.closeSocket();
        }
        
        if(wsReconnectionTimer){//此时还有定时器在运行的话,那么就进行清除
          clearTimeout(wsReconnectionTimer);
        }
      
      },
    
      /**
       * 页面相关事件处理函数--监听用户下拉动作
       */
      onPullDownRefresh: function () {
    
      },
    
      /**
       * 页面上拉触底事件的处理函数
       */
      onReachBottom: function () {
    
      },
    
      /**
       * 用户点击右上角分享
       */
      onShareAppMessage: function () {
    
      }
    })
    

    相关文章

      网友评论

          本文标题:websocket的注意事项

          本文链接:https://www.haomeiwen.com/subject/jduwaktx.html