Multiform 零件类型在 Angular 中不起作用

Question

设置：使用 Angular 6

http 版本 - "@angular/http": "^6.1.9",

我尝试 post csv 文件使用多部分表单数据作为 header 但它使请求失败。浏览器似乎总是将 content-type 作为 "application-json" 发送。 我尝试了互联网上提供的多种更改内容类型的方法，但没有任何效果。我尝试过的一些方法是 set content type as undefined 这会在 http.js 文件，让浏览器检测 忽略设置内容类型 也失败了。请帮我解决这个问题

groupBulkUpload(file) {  
    const formData = new FormData();
    formData.append('file', file);
    // commented the below lines
    // formData.append('file', file, { type: 'text/csv' }));
    // let header = new HttpHeaders()
    // .set("Content-Type" , `multipart/form-data; boundary=${formData._boundary}`)
    // let options = { headers: header };

    let url = this.getAnyConfigUrl("rate");
    return this.http.post(url,formData)
  }

 //calling the api
 const blob = new Blob([csvData]);
    var f = new File([blob] , "filename.csv", {type: 'text/csv', lastModified: new Date().getDate()})
    this._config.groupBulkUpload(f).subscribe(val=>{
      console.log(val)
    })

更新：浏览器始终将其视为 Json 类型。所以它无法检测到我猜是 CSV 格式。有什么想法吗？

要求Headers：

请求负载：

Answer 1

请检查您是否使用拦截器拦截http请求并添加JSON数据类型。

您在 append 方法中缺少第三个参数（可选），但您可以将文件名作为第三个参数传递。对于文件 formData.append，您可以将文件名作为第三个参数传递。如果我们省略 blob 类型的第三个参数，那么默认文件名将是 blob.

参数：

name The name of the field whose data is contained in value.

value The field's value. This can be a USVString or Blob (including subclasses such as File). If none of these are specified the value is converted to a string.

filename Optional The filename reported to the server (a USVString), when a Blob or File is passed as the second parameter. The default filename for Blob objects is "blob". The default filename for File objects is the file's filename.

试试这个并从拦截器中删除这个调用。

groupBulkUpload(file) {
    const formData = new FormData();
    formData.append('file', file, "filename.csv");
    let url = this.getAnyConfigUrl("rate");
    return this.http.post(url, formData);
}
//calling the api
const blob = new Blob([csvData]);
var f = new File([blob], "filename.csv", { type: 'text/csv', lastModified: new Date().getDate() })
this._config.groupBulkUpload(f).subscribe(val => {
    console.log(val)
})

Multiform 零件类型在 Angular 中不起作用

Multiform part type is not working in Angular

javascript

multipartform-data

httpclient

angular