有没有办法将HTTP请求保留到待处理请求数小于N？-解网

问：

我正在研究用户可以一次上传 N 个文件的东西。但是，由于我还一次发送 N 个并行请求（每个文件上传 1 个请求），它很容易阻塞服务器，并且它会开始为发出的请求抛出 429（请求过多）错误。

如果已经有 K 个待处理的请求，有没有办法阻止发出请求（也不会阻止 UI）？

这里有一个最小的代码块，可以让你了解我目前正在做什么：

filesToUpload.forEach(function(file) {
    // abstract function which converts the given file to base64,
    // prepares the payload, makes a POST request and returns a promise
    upload(file, successCallback, errorCallback);
}

javascript angularjs ajax

var filesToUpload = [
  "file1.txt",
  "file2.txt",
  "file3.txt",
  "file4.txt",
  "file5.txt",
  "file6.txt",
  "file7.txt",
  "file8.txt",
]

function upload(filename, callback) {
  // abstract function which converts the given file to base64,
  // prepares the payload, makes a POST request and returns a promise
  setTimeout(function() {
    console.log("<!-- uploaded " + filename);
    typeof callback === 'function' && callback()
  }, Math.random() * 1000 + 500)
}


function start_sequence(filesToUpload, maxK, callback) {
  var K = maxK;

  function do_loop(filesToUpload, callback) {

    if (!filesToUpload.length) {
      if (K == maxK) {

        // end the loop
        typeof callback === 'function' && callback();
      }
      return;
    }

    // upload now first K's
    while (K > 0) {
      K--
      var first = filesToUpload.shift();
      console.log("--> sending " + first);
      upload(first, function() {
        K++;
        do_loop(filesToUpload, callback)
      });
    }
  }

  // start the loop
  do_loop(filesToUpload, callback);

}


start_sequence(filesToUpload, 3, function() {
  console.log("all done!")
});

.as-console-wrapper {
  max-height: 100% !important;
  top: 0;
}

0赞 Jrdo 8/8/2022 #3

您可以使用递归按顺序执行此操作。这需要修改以处理错误。

(function fn(files, successCallback, errorCallback){
    if(files.length){
        upload(files.shift(), (...args) => {
            successCallback(...args);
            fn(files, successCallback, errorCallback)
        }, errorCallback);
    }
})(filesToUpload, successCallback, errorCallback);

const UPLOAD_QUEUE = [];
let progress_queue = [];
const MAX_UPLOADS = 5;

throttledUpload();

function throttledUpload() {
    const max = MAX_UPLOADS - progress_queue.length;
    for(let i = 0; i < UPLOAD_QUEUE.length; i++){
        if(i > max) break;
        uploadFile(UPLOAD_QUEUE[i], i);
    }
    progress_queue = progress_queue.concat(UPLOAD_QUEUE.splice(0, max));
}

async function uploadFile(file, idx) {
    try {
        await upload(file, successCallback, errorCallback);
        throttledUpload();
    } catch (err) {
        UPLOAD_QUEUE.push(file);
    } finally {
        progress_queue.splice(idx, 1);
        throttledUpload();
    }
}

上一个：需要在相同的 bootstrap 模型中使用 put 和 post，但只能使用 post 工作

下一个：Datepicker，使用AngularJS和PHP从数据库动态阻止日期

有没有办法将HTTP请求保留到待处理请求数小于N？

Is there a way to hold HTTP requests to be made until the number of pending requests are less than N?

评论

评论

评论