websocket初体验(小程序)

之前上个公司做过一个二维码付款功能,涉及到websocket功能,直接上代码

小程序onShow方法下加载:

/**  页面的初始数据 **/
 data: {
    code: "",
    onshowCode: "",
    hiden: true,
    show: false,
    array: {},
    has_password: "",
    openid: "",
    showPop: false,
    pwd: "",
    num: "",
    cashierid: "",
    socketOpen: false
  },
  onShow: function() {
    var _this = this;
    a.get("ipass.get_user_qr", {}, function(e) {
//获取到openID(传的参数)      
      console.log(e);
      var openid = e.openid;
      console.log(openid);
      _this.setData({
        array: e,
        openid: openid
      });
      var token = _this.data.openid;
      var socketOpen = false;
      var data = { type: "ready", uid: token };   // 给websocket传值
      var socketMsgQueue = JSON.stringify(data);   // 将值转化为字符串
      // 连接websocket
      wx.connectSocket({
        url: "wss://paytest.kuaiyunma.com",    //websocket 地址
        success(e) {
          console.log(e);
        }
      });
      // 监听WebSocket 连接打开事件
      wx.onSocketOpen(function(res) {
        console.log("123");
        _this.data.socketOpen = true; 
        console.log("数据发送中" + socketMsgQueue);
        _this.sendSocketMessage(socketMsgQueue);  // 自定义方法
      });
      // 监听WebSocket 错误事件
      wx.onSocketError(function(res) {
        console.log("WebSocket连接打开失败,请检查!");
      });
      // 监听WebSocket 接受到服务器的消息事件
      wx.onSocketMessage(function(res) {
        console.log(JSON.parse(res.data));
//获取到websocket返回的值
        var res = JSON.parse(res.data);
//将值转化为对象
        var num = res.fee;
//定义传过来的数值
        var cashierid = res.cashierid;
// 根据传的值进行判断    
        if (res.type == "password") {
          _this.setData({
            showPop: true,
            num: num,
            res: res,
            cashierid: cashierid
          });
        } else if (res.type == "pay_result") {
          if (res.result == "ok") {
            a.post(
              "ipass.pay",
              {
                cashierid: _this.data.cashierid,
                money: _this.data.num
              },
              function(e) {
                console.log(e);
                if (e.result.success === true) {
                  wx.showToast({
                    title: "支付成功!",
                    icon: "success"
                  });
                } else {
                  wx.showToast({
                    title: "支付失败",
                    icon: "none"
                  });
                }
                _this.clearNum();
              }
            );
          } else {
            wx.showToast({
              title: "支付失败",
              icon: "none"
            });
          }
        }
      });
    });
  },
//设置公共传值的方法~~
  sendSocketMessage: function(msg) {
    var socketOpen = this.data.socketOpen;
    if (socketOpen) {
      wx.sendSocketMessage({
        data: msg,
        success(e) {
          console.log(e);
        }
      });
    }
  },
  inputPwd(e) {
    console.log(e);
    var pwd = e.target.dataset.value;
    let rule = /[0-9]/;
    if (!rule.test(pwd)) {
      return;
    }
    pwd = this.data.pwd + pwd;
    console.log(pwd);
    this.setData({
      pwd: pwd
    });
    var _this = this;
    if (pwd.toString().length == 6) {
      wx.showLoading({
        title: "支付中...",
        mask: true
      });
      console.log("成功");
      a.post(
        "ipass.password.auth",
        {
          password: _this.data.pwd
        },
        function(e) {
          console.log(e);
          wx.hideLoading();
          // var socketOpen = true;
          // 定义传的data值
          var data1 = {
            type: "validate_password",
            token: _this.data.res.token,
            cashierid: _this.data.res.cashierid,
            password: _this.data.pwd
          };
          // 将转换的对象转换为字符串
          var socketMsgQueue1 = JSON.stringify(data1);
          if (!e.auth) {
            _this.setData({
              showPop: false,
              pwd: ""
            });
            wx.showToast({
              title: "支付密码错误",
              icon: "none"
            });
          } else {
            // 发送socket信息
            _this.sendSocketMessage(socketMsgQueue1);

            _this.setData({
              showPop: false,
              pwd: ""
            });
          }
        }
      );
      setTimeout(() => {
        wx.hideLoading({
          success: function() {
            _this.setData({
              showPop: false,
              hasPaid: true
            });
          }
        });
      }, 2000);
    }
  },

 

websocket初体验(小程序)

上一篇:初学小程序——配置问题(3)


下一篇:小程序文字显示换行