POST请求可在Postman中使用，但在JS代码中给出了Bad Request

Question

我正在使用Flask在本地服务器上托管一些python代码，并且正在尝试发送带有图像的POST请求。使用Postman，一切正常：

除了Content-Type（无授权）外，没有其他标头。

javascript函数中的同一请求返回400（错误请求）。

    var form = new FormData();
    form.append("image", "image089.png");

    var settings = {
      "async": true,
      "crossDomain": true,
      "url": "http://127.0.0.1:5000/croprect",
      "method": "POST",
      "processData": false,
      "contentType": false,
      "mimeType": "multipart/form-data",
      "data": form
    }

    $.ajax(settings).done(function (response) {
      console.log(response);
    });

文件“ image089.png”与脚本位于同一目录中。该功能由click事件包装，并分配给按钮。该Web应用程序本地托管在Tomcat服务器中。我不确定还有哪些其他信息有用。

我发现了很多类似的问题，但是大多数都没有答案。

编辑：使用XHR语法也不起作用：

    var xhr = new XMLHttpRequest();
    xhr.withCredentials = true;

    xhr.addEventListener("readystatechange", function () {
      if (this.readyState === 4) {
        console.log(this.responseText);
      }
    });

    xhr.open("POST", "http://127.0.0.1:5000/croprect");

    xhr.send(data);

Answer 1

您没有正确附加到FormData对象。当前，您正在将image的值设置为字符串。相反，您将需要指示FormData将该文件内容附加到该字符串中包含的名称：

  

此方法有两个版本：两个参数和三个参数   版本：

     

1| formData.append(name, value); 2| formData.append(name, value, filename);

更改

form.append("image", "image089.png");

收件人

form.append("image", BlobWithYourImage, "image089.png");

还请注意以下警告：

  

如果您指定Blob作为要附加到FormData对象的数据，   将在服务器中报告给服务器的文件名   “ Content-Disposition”标头用于随浏览器的不同而变化。

Reference