Angular 2没有将Content-Type设置为'multipart / form-data',而是设置为'application / json'

时间:2017-08-17 17:15:37

标签: angular upload ionic2 multipartform-data multipart

我正在尝试在基于Angular 2的Ionic移动项目中上传文件。

我有一个FormData对象,至少有3个字段(_id,type和files)。

this.formData = new FormData();
if (fileCount > 0) { // a file was selected
  for (let i = 0; i < fileCount; i++) {
    this.formData.append('file', inputEl.files.item(i));
  }
}

[... in the upload method I pass this.formData as files ...]

files.append('_id', data._id);
files.append('tipo', tipo);

我将其传递给我的上传方法,并将“Content-Type”设置为“multipart / form-data”

let options: RequestOptionsArgs = new RequestOptions();
options.headers = this.headers; (In this.headers I have my Authorization header set)
options.headers.delete('Content-Type');
options.headers.set('Content-Type', 'multipart/form-data');

我发了一篇http帖子

this.http.post(
  `${this.apiUrl}/utenti/upload`,
  files,
  options
)

但我从服务器收到错误的回复:

Sorry, an error occurred loading the page (500)
Unexpected token -

我查看Chrome的网络标签,我可以看到我的请求标头错误:

Content-Type: application/json

另一方面,我的有效负载是正确的,具有表单数据样式:

------WebKitFormBoundaryKiWq1WTTF3AJCFRX
Content-Disposition: form-data; name="file"; filename="IMG_0001.JPG"
Content-Type: image/jpeg


------WebKitFormBoundaryKiWq1WTTF3AJCFRX
Content-Disposition: form-data; name="_id"

58e7b968bed0575e13efc63c
------WebKitFormBoundaryKiWq1WTTF3AJCFRX
Content-Disposition: form-data; name="tipo"

foto
------WebKitFormBoundaryKiWq1WTTF3AJCFRX--

对这里的错误有什么猜测?

1 个答案:

答案 0 :(得分:2)

如果您已实施拦截器,请检查您是否覆盖了标头。