如何使用JavaScript中的Ajax調用將數組中存儲的多個base64圖像發送到Java

Question

我允許用戶一次上傳多張圖片。

我將所有圖像源存儲在一個數組中，並使用ajax發送。

Ajax調用返回一條錯誤消息，即大小過長。

我的代碼段：

function save_domain_images(base64ImageSrc){
  var datastring = "&token="+domainImgSaveSession+"&imgSrc="+base64ImageSrc+"&action=saveDomainImg";
  $.ajax({
    type : "POST",
    url : base+"/AppUserListServiceProvider",
    data : datastring,
    cache : false,
    success : function(data){
      data                      = JSON.parse(data);
      domainImgSaveSession      = data["randomNew"];
      if(data["error"] == null && data["croppedImg"] != null){
        console.log("data : "+data["croppedImg"]);
      }
    },
    error : function(){}
  });
}

Answer 1

const match = /^\s*data:([\w/]+)(?:;base64)?,/.exec(base64Str);
const type = match[1];
const blob = b64toBlob(url.slice(match[0].length), type);
const formData = new FormData();
formData.append('image', blob, name);

function b64toBlob(base64) {
  const code = window.atob(base64.split(",")[1])
  const aBuffer = new window.ArrayBuffer(code.length)
  const uBuffer = new window.Uint8Array(aBuffer)

  for (let i = 0; i < code.length; i++) {
    uBuffer[i] = code.charCodeAt(i)
  }

  const Builder = window.WebKitBlobBuilder || window.MozBlobBuilder
  if (Builder) {
    const builder = new Builder()
    builder.append(buffer)

    return builder.getBlob(format)
  } else {
    return new window.Blob([buffer], {
      type: format
    })
  }
}

然后您可以發布formData