小程序系列--网络库封装(五)

使用请求队列

在实际的使用过程中，可能会出现同时有多个请求的并发问题，以及网络失败请求重试的问题。wx小程序主可以理解为一个轻量级的应用，不能有太多的并发操作，所以可以引入队列来控制并发，处理重试。

队列的主要是通过数组的末尾添加，首位截取的思想实现的。

var requestQueue = []; //请求队列
requestQueue.push(req);  //末尾添加请求
var req = requestQueue.shift();   //头部取出请求

接下来就可以创建发起请求的方法

function request(req) {
  req.repeatCount = 0; //记录重试次数
  req.isLoding = false; //请求是否显示laoding
  requestQueue.push(req); //将请求添加到队列中
  handleRequest(); //递归处理队列中的请求
}

//===============华丽分割线==================================
function handleRequest() {
  //取出队列第一个请求
  var req = requestQueue.shift();
  if (!req) return;

  if (DEBUG) {
    console.log("======>url:" + req.url);
    console.log("======>params:" + Obj2String(req.data));
    console.log("======>header:" + Obj2String(getHttpHeader()));
  }
  //是否展示loading
  if (!req.isLoding) {
    req.isLoding = true;
    wx.showLoading({
      title: ' ',
    });
  }
  //发起请求
  wx.request({
    url: req.url,
    data: req.data,
    header: getHttpHeader(),
    method: "POST",
    success: function (res) {
      if (DEBUG) {
        console.log("======>result:" + Obj2String(res.data));
        console.log("======>result:" + Obj2String(res.data.data));
      }
      var data = getResultData(res);
      if (data) {
        //请求成功
        wx.hideLoading();
        req.isLoding = false;
        req.success(data);
        //递归处理其他请求
        handleRequest();
      } else if (getResultCode(res) == -401) {
        //处理 -401
        relogin(req);
      } else if (req.repeatCount < REPEAT_COUNT) { //常量，最大的重试次数
        //加入队列再次请求，最多3次
        req.repeatCount++;
        requestQueue.push(req); //失败了重新加入队列进行重试
        //递归处理其他请求
        handleRequest();
      } else {
        //超出3次，显示错误处理
        wx.hideLoading();
        req.isLoding = false;
        handleError(res);
        if (isHostMethod(req, "fail")) {
          req.fail();
        }
      }

    },
    fail: function (res) {
      if (DEBUG) {
        console.log("======>error:" + res.errMsg);
      }
      if (req.repeatCount < REPEAT_COUNT) {
        //加入队列再次请求，最多3次
        req.repeatCount++;
        requestQueue.push(req); //失败了重新加入队列进行重试
        //递归处理其他请求
        handleRequest();
        return;
      }
      if (isHostMethod(req, "fail")) {
        req.fail(res.errMsg);
      }

      req.isLoding = false;
      wx.hideLoading();
      showErrorToast(res.errMsg);
    }

  })
}

gitHub源码