如何进行递归发布请求？答案

【问题标题】：how to make recursive post requests?如何进行递归发布请求？
【发布时间】：2021-02-03 11:09:14
【问题描述】：

您好，我必须在服务器上发送多张图像，但我必须一次发送一张，我使用此函数将图像转换为 base64 字符串，然后发送它

function RiduciImgFile2(input) {
    let ido = 0
    if (input.files && input.files[0]) {
        const canvas = document.getElementById("canvas");
        var file = input;
        var img = document.createElement("img");
        var reader = new FileReader();
        reader.onload = function (e) {
            img.src = e.target.result;
            var ctx = canvas.getContext("2d");
            ctx.drawImage(img, 0, 0);

            img.onload = function (w) {
                var MAX_WIDTH = 1024;
                var MAX_HEIGHT = 1024;
                var width = img.width;
                var height = img.height;

                if (width > height) {
                    if (width > MAX_WIDTH) {
                        height *= MAX_WIDTH / width;
                        width = MAX_WIDTH;
                    }
                } else {
                    if (height > MAX_HEIGHT) {
                        width *= MAX_HEIGHT / height;
                        height = MAX_HEIGHT;
                    }
                }
                canvas.width = width;
                canvas.height = height;
                var ctx = canvas.getContext("2d");
                ctx.drawImage(img, 0, 0, width, height);
                var dataurl = canvas.toDataURL("image/png");
                var Dati = [];
                Dati.push(dataurl, ido)
                $.ajax({
                    type: "POST",
                    url: 'Run?pr=save_photo',
                    data: JSON.stringify(Dati),
                    success: function (r) {
                        // OK
                    },
                    error: function (e) {
                        // ERROR
                    },
                    traditional: true
                });


            };
        };
        reader.readAsDataURL(file);
    }
}

有没有办法通过承诺来做这样的事情

function files(){
   let f = document.querySelector("#input").files;
   for(let i = 0; i< f.files.length; i++){
          RiduciImgFile2(f[i])
   }

}

并等待函数 RiduciImgFile2() 完成请求？或者可能有递归方式？

【问题讨论】：

为什么你必须一次发送一个？
因为如果我发送太多（或太大）图像，服务器会给我一个超时错误

标签： ajax recursion promise async-await fetch

【解决方案1】：

也许一种方法是使用 forEach 和 axios（你必须导入这个库）。否则，请使用类似的 fetch，它是 JS 的一部分。

files.forEach(file => {
   postImg(file);
})

function postImg(file) {
   axios.post(url, file).then(() => {
      //something to happen if POST is successful 
   }).catch(err => console.log(err))
}

这是解决它的一种方法，但是，请了解有关如何进行多个查询的更多信息。我不确定循环是不是最好的方法。

【讨论】：