Angular 6:无法正确设置 http Header 的 Content-Type

Posted

技术标签:

【中文标题】Angular 6:无法正确设置 http Header 的 Content-Type【英文标题】:Angular 6: Unable to set Content-Type of http Header correctly 【发布时间】:2019-05-06 05:30:55 【问题描述】:

我正在尝试使用 Angular 6 中的 HttpHeader 进行发布调用,并将 Content-Type 设置为 application/json。 但是对于 Content-Type,服务器获取的是 x-www-form-urlencoded 而不是 application/json。

service.ts

   
myFunction(id: string, name: string, fields: string[]) 
  const body = 
    id: id,
    name: name,
    fields: fields
  ;
  let headers = new HttpHeaders();
  headers= headers.set('content-type', 'application/json');
  return this.http.post(this.URL , body, headers);

组件.ts

submit()
  this.myService.myFunction(this.id, this.form.value.name,  
  this.form.value.fields).subscribe((res:any) => 
    console.log(this.form);
  , error => 
    console.log(JSON.parse(error.error).errors);
  )

【问题讨论】:

【参考方案1】:

您需要在选项中设置标题。

return this.http.post(this.URL , body, headers : new HttpHeaders( 'Content-Type': 'application/json' ));

【讨论】:

【参考方案2】:

只需使用append 函数添加新标题,最后在选项上设置标题

试试这样的

let header = new HttpHeaders();
headers= headers.append('content-type', 'application/json');
return this.http.post(this.URL , body, headers : header);

如果它不起作用尝试添加这样的标题

let header = new HttpHeaders('content-type': 'application/json');

希望它有所帮助 - 编码愉快 :)

【讨论】:

我认为它会让 headers 和 headers: headers 或 es6 headers

以上是关于Angular 6:无法正确设置 http Header 的 Content-Type的主要内容,如果未能解决你的问题,请参考以下文章

无法获得在 Angular 2 代码中映射的正确 http 响应

Angular 10:使用变量设置 IFrame URL 输入

Angular 6指令属性不会动态变化

angular中get方法URL无法正确传输

在 Angular 6 中添加 http 标头

无法获取 /page angular 2 路由错误