Question

我想立即将图像文件列表传递给服务器。

这是我的代码，其中函数srcToFile用于将新文件创建为图像。

var formData = new FormData();

// Iterate all td's in second column
$("#table-image tbody tr:not(:first-child)").each(function (index, value) {
  var blob = value.cells[4].innerText;
  var fileName = (index + 1) + ".jpg";
  srcToFile(blob, fileName, "image/jpeg")
    .then(function (file) {
      formData.append("file", file);
      alert(formData.getAll("file").length); ** // I know that I can use aJax jquery to pass one by one at here**
    }, function (error) {
      //
    });
});

function srcToFile(src, fileName, mimeType) {
    return (fetch(src)
        .then(function (res) { return res.arrayBuffer(); })
        .then(function (buf) { return new File([buf], fileName, { type: mimeType }); })
    );
}

在这种情况下如何使用formData？

Answer 1

将srcToFile返回的所有承诺放入数组中，然后使用$.when()等待所有这些承诺。

var promises = $("#table-image tbody tr:not(:first-child)").map(function (index, value) {
  var blob = value.cells[4].innerText;
  var fileName = (index + 1) + ".jpg";
  return srcToFile(blob, fileName, "image/jpeg")
    .then(function (file) {
      formData.append("file[]", file);
    }, function (error) {
      //
    });
}).get();
$.when(promises).then(function() {
    alert(formData.getAll("file[]").length);
    return $.ajax({
        url: "yourURL",
        type: "post",
        processData: false,
        data: formData
    });
}).then(...)

然后jquery并获取src - 将图像上传到服务器

1 个答案: