Question

我需要通过multipart / form-data上传文件和一些元信息，如下所示：

Header
----boundary
Meta
----boundary
File
----boundary

出于某种原因，我总是得到 400错误，后端服务器告诉我， Meta -Field缺失。但是，如果我使用Wireshark查看Hex / Ascii转储，那么该字段肯定存在以下Curl命令工作正常，文件成功上传：

curl -H "Expect:" -v -i -X POST -H "Content-Type: multipart/form-data" -H "Authorization: "token" -F "File=@/location" -F 'Meta={"access":"token"}' http://path

因此，这似乎不是后端故障。我的Angular（4.1.3）请求一定很糟糕，但我无法弄清楚它有什么问题。

模板的代码：

<input #file_input type="file" (change)="onFileInputChange($event)" multiple>

Angular2码：

onFileInputChange(event) {
  let fileList: FileList = event.target.files;
  for (let i = 0; i < fileList.length; i++) {
    let fp: File = fileList[i];
    let formData: FormData = new FormData();
    formData.append('File', fp, fp.name);
    const body = JSON.stringify({
       'access': "token"
    });
    this.formData.append('Meta', body);
    let RequestHeader = new Headers();
    // auto set content type
    RequestHeader.append('Content-Type', '');
    RequestHeader.append('Accept', 'application/json');
    RequestHeader.append('Authorization', "token");

    this.http.post(this.backend_url, formData, RequestHeader).map(
    res => res.json()).subscribe(
            data => console.log('success'),
            error => console.log(error))
  }
}

我在这里缺少什么？

Answer 1

我终于找到了解决方案。 Content-Type标头格式错误：

Content-Type: , multipart/form-data; boundary=----WebKit12345

预设了实际代码中的内容类型标题。致电

headers.set('Content-Type', '');

我认为，标题内容类型被覆盖了，但实际上是一个空字符串，因此有一个逗号，当然无法解析。
我通过完全删除内容类型标题解决了这个问题：

headers.delete('Content-Type');

文件通过multipart / form-data上传Angular2,400错误

1 个答案: