• Linux
  • apache
  • centos
  • Git版本管理
  • Linux基本命令
  • linux配置与优化
  • Nginx
  • PHP
  • Redis
  • Supervisor
  • Swoole
  • windows
  • THINKPHP
  • 开发者手册
  • Chat GPT / Open Ai
  • 小程序全局socket使用 并自定义发送心跳

    全屏阅读
  • 基本信息
  • 作者:
  • 作者已发布:925篇文章
  • 发布时间:2023年11月01日 0:50:43
  • 所属分类:bob主页小程序
  • 阅读次数:222次阅读
  • 标签:
  • //app.js
    App({
      globalData: {
        userInfo: null,
        socketUrl: "wss:.....", //socketUrl
        //延迟
        timeout: 10000,
        socketHeartTimer: null,
        //socket连接回调函数
        callback: function () {},
        //socket连接定时器
        socketClientTimer: null,
        //当前socket是否连接
        isSocketConnect: false
      },
     
      //建议在这做全局登录标识 是否已经登录决定是否onShow中是否调用连接
      onLaunch: function () {},
     
      //生命周期onShow中调用socket连接
      onShow: function () {
        //此处可以根据登录状态判断是否调用连接socket
        // 连接socket
        // 检查用户登录状态,并决定是否开启socket
        this.checkLoginUserSocket();
        //判断是否登录 连接socket
        this.globalData.socketClientTimer = setInterval(() => {
          // 定时器---检查用户登录状态,并决定是否开启socket
          this.checkLoginUserSocket();
        }, 30000)
      },
     
      // 检查用户登录状态,并决定是否开启socket
      checkLoginUserSocket: function () {
        if ("已经登录状态下根据情况判断") {
          //登录状态下调用连接socket 且判断是否已经连接socket 
          if (!this.globalData.isSocketConnect) {
            // console.log("-----用户一登录---连接socket")
            this.connectSocketFunciton()
          }
        } else {
          // console.log("-----用户未登录--关闭socket")
          //未登录状态下清除定时器关闭socket
          this.closeSocketFunction()
        }
      },
     
      // 小程序进入后台
      onHide: function () {
        // 关闭全局socket状态连接定时器
        clearInterval(this.globalData.socketClientTimer)
        // 关闭socket
        this.closeSocketFunction()
      },
     
      //小程序连接socket
      connectSocketFunciton: function () {
        var that = this
        var socketUrl = this.globalData.socketUrl
        wx.connectSocket({
          url: socketUrl,
          success: (res => {
            // 标识socket已连接
            that.globalData.isSocketConnect = true
            // 初始化连接监听
            that.initEventHandler()
          }),
          fail: (fail => {})
        })
      },
     
      // 绑定监听
      initEventHandler: function () {
        var that = this
        // socket连接开启
        wx.onSocketOpen((result) => {
          // 开启心跳
          that.startHeart()
        })
        // socket连接关闭
        wx.onSocketClose((res) => {
          if (that.globalData.isSocketConnect) {
            that.connectSocketFunciton()
          }
        })
        // 接收socket消息
        wx.onSocketMessage((res) => {
          console.log("onSocketMessage")
          console.log(res)
          //第一次消息如果为init就绑定uid
          var data = JSON.parse(res.data)
          //这里data可以根据后端返回的数据做一些处理 根据自己的需求做出对应的处理
          // 全局socket接收消息的方法回调
          that.globalData.callback(res)
        })
      },
     
      //发送心跳
      startHeart: function () {
        if (this.globalData.isSocketConnect) {
          this.globalData.socketHeartTimer = setInterval(() => {
            var msg = JSON.stringify({
              'data': 'ping'
            })
            wx.sendSocketMessage({
              data: msg,
              success: function (res) {},
              fail: function (res) {}
            })
          }, 10000)
        } else {
          clearTimeout(this.globalData.socketHeartTimer)
        }
      },
     
      //此页面关闭socket和定时器的函数
      closeSocketFunction: function () {
        if (this.globalData.isSocketConnect) {
          // 标识socket已断开
          this.globalData.isSocketConnect = false
          // 关闭socket连接
          wx.closeSocket()
          // 关闭socket心跳定时器
          clearInterval(this.globalData.socketHeartTimer)
        }
     
      }
    })
    //在外面调用的方式
     
      onLoad:function(){
        this.onSoekctCallback()
      },    
     
      //根据需求对data做出自己的处理
      onSoekctCallback: function () {
        var that = this
        app.globalData.callback = function (res) {
          var data = JSON.parse(res.data)
            
        }
      },

    顶一下
    (0)
    100%
    订阅 回复
    踩一下
    (0)
    100%
    » 郑重声明:本文由mpxq168发布,所有内容仅代表个人观点。版权归恒富网mpxq168共有,欢迎转载, 但未经作者同意必须保留此段声明,并给出文章连接,否则保留追究法律责任的权利! 如果本文侵犯了您的权益,请留言。
  • 【上一篇】
  • 【下一篇】
  • 目前有 0 条留言 其中:访客:0 条, 博主:0 条

    给我留言

    您必须 [ 登录 ] 才能发表留言!