• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

小程序websocket用法

原作者: [db:作者] 来自: [db:来源] 收藏 邀请
// socket已经连接成功
var socketOpen = false
// socket已经调用关闭function
var socketClose = false
// socket发送的消息队列
var socketMsgQueue = []
// 判断心跳变量
var heart = \'\'
// 心跳失败次数
var heartBeatFailCount = 0
// 终止心跳
var heartBeatTimeOut = null;
// 终止重新连接
var connectSocketTimeOut = null;
var i=1
const url = \'\'//socket链接地址,需要在微信后台配置
var webSocket = {
  connectSocket: function () {
    // wx.showLoading({
    //   title: \'\',
    //   mask: true,
    // })
    socketOpen = false
    socketClose = false
    socketMsgQueue = []
    wx.connectSocket({
      url: \'ws://\' +url+\'/websocket/\'+wx.getStorageSync(\'token\'),
      // header: { \'ticket\': wx.getStorageSync(\'token\')},
      success: function (res) { 
        if (res) {
          // 成功回调
          // console.log(res)
          // options.success && options.success(res);
        }
      },
      fail: function (res) {
        if (res) {
          // 失败回调
          // options.fail && options.fail(res);
        }
      }
    })
  },

  /**
   * 通过 WebSocket 连接发送数据
   * @param {options} 
   *   data    String / ArrayBuffer    是    需要发送的内容
   *   success    Function    否    接口调用成功的回调函数
   *   fail    Function    否    接口调用失败的回调函数
   *   complete    Function    否    接口调用结束的回调函数(调用成功、失败都会执行)
   */
  sendSocketMessage: function (options) {
    if (socketOpen) {
      wx.sendSocketMessage({
        data: options.msg,
        success: function (res) {
          if (options) {
            options.success && options.success(res);
          }
        },
        fail: function (res) {
          if (options) {
            options.fail && options.fail(res);
          }
        }
      })
    } else {
      socketMsgQueue.push(options.msg)
    }
  },

  /**
   * 关闭 WebSocket 连接。
   * @param {options} 
   *   code    Number    否    一个数字值表示关闭连接的状态号,表示连接被关闭的原因。如果这个参数没有被指定,默认的取值是1000 (表示正常连接关闭)
   *   reason    String    否    一个可读的字符串,表示连接被关闭的原因。这个字符串必须是不长于123字节的UTF-8 文本(不是字符)
   *   fail    Function    否    接口调用失败的回调函数
   *   complete    Function    否    接口调用结束的回调函数(调用成功、失败都会执行)
   */
  closeSocket: function (options) {
    if (connectSocketTimeOut) {
      clearTimeout(connectSocketTimeOut);
      connectSocketTimeOut = null;
    }
    socketClose = true;
    var self = this;
    self.stopHeartBeat();
    wx.closeSocket({
      success: function (res) {
        console.log(\'WebSocket 已关闭!\');
        if (options) {
          options.success && options.success(res);
        }
      },
      fail: function (res) {
        if (options) {
          options.fail && options.fail(res);
        }
      }
    })
  },

  // 收到消息回调
  onSocketMessageCallback: function (msg) {

  },

  // 开始心跳
  startHeartBeat: function () {
    console.log(\'socket开始心跳\')
    var self = this;
    heart = \'heart\';
    self.heartBeat();
  },

  // 结束心跳
  stopHeartBeat: function () {
    console.log(\'socket结束心跳\')
    var self = this;
    heart = \'\';
    if (heartBeatTimeOut) {
      clearTimeout(heartBeatTimeOut);
      heartBeatTimeOut = null;
    }
    if (connectSocketTimeOut) {
      clearTimeout(connectSocketTimeOut);
      connectSocketTimeOut = null;
    }
  },

  // 心跳
  heartBeat: function () {
    var self = this;
    if (!heart) {
      return;
    }
    self.sendSocketMessage({
      msg: JSON.stringify({
        \'messageType\':1//心跳
      }),
      success: function (res) {
        console.log(\'socket心跳成功\');
        if (heart) {
          heartBeatTimeOut = setTimeout(() => {
            self.heartBeat();
          }, 60000);
        }
      },
      fail: function (res) {
        console.log(\'socket心跳失败\');
        if (heartBeatFailCount > 2) {
          // 重连
          self.connectSocket();
        }
        if (heart) {
          heartBeatTimeOut = setTimeout(() => {
            self.heartBeat();
          }, 60000);
        }
        heartBeatFailCount++;
      },
    });
  }
}

// 监听WebSocket连接打开事件。callback 回调函数
wx.onSocketOpen(function (res) {
  console.log(\'WebSocket连接已打开!\')
  wx.hideLoading();
  // 如果已经调用过关闭function
  if (socketClose) {
    webSocket.closeSocket();
  } else {
    socketOpen = true
    for (var i = 0; i < socketMsgQueue.length; i++) {
      webSocket.sendSocketMessage(socketMsgQueue[i])
    }
    socketMsgQueue = []
    webSocket.startHeartBeat();
  }
})

// 监听WebSocket错误。
wx.onSocketError(function (res) {
  console.log(\'WebSocket连接打开失败,请检查!\', res)
})

// 监听WebSocket接受到服务器的消息事件。
wx.onSocketMessage(function (res) {
  console.log(\'收到服务器内容:\' + res.data)
  if (res.data ==\'SUCCESS\'){
     return;
  }
  webSocket.onSocketMessageCallback(res.data)
})

// 监听WebSocket关闭。
wx.onSocketClose(function (res) {
  console.log(\'WebSocket 已关闭!\')
  //if (!socketClose) {
  let time = Math.pow(2, i)
  i++
  if (time==8){
    i=1
  }
    clearTimeout(connectSocketTimeOut)
    connectSocketTimeOut = setTimeout(() => {
      webSocket.connectSocket();
    }, time*1000);
  //}
})

module.exports = webSocket;

 在需要的页面引入,然后在onload函数中加入 

   chat.onSocketMessageCallback = this.onSocketMessageCallback;//onSocketMessageCallback是回调函数名
   以上就是一个完整的wobsocket实例

鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
热门推荐
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap