Angular http module - post headers

Question

I'm unable to change the headers when doing a post request with http module in Angular (with Ionic). Here is my code:

import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';

const apiUrl = "https://webhook.site/c2d56330-84d4-47cf-9f98-472f7eac8000";

@Injectable({
  providedIn: 'root'
})
export class APIService {

  constructor(private http: HttpClient) { }

  getToken(){
    var body = {
      'data1': 'data2',
      'somedata3': 'data4',
  };
  let headers = new HttpHeaders().append('Content-Type', 'application/json');

  this.http.post(apiUrl, JSON.stringify(body), {headers}).subscribe(data =>
    console.log(data));

  console.log(headers.get('Content-Type')); //return 'application/json'
  }
}

Everything works well, but it still sends header "content-type: text/plain" instead of "content-type: application/json".

Do I type something wrong?

This might help explain it. stackoverflow.com/questions/45286764/… — Jason White
– Jason White, Commented Feb 24, 2019 at 21:21

Anton Sarov · Accepted Answer · 2019-02-24 21:19:08Z

2

I'd prefer something like:

import { HttpHeaders } from '@angular/common/http';

const httpOptions = {
  headers: new HttpHeaders({
    'Content-Type':  'application/json'
  })
};
this.http.post<Foo>(this.apiUrl, body, httpOptions)

Also I don't see a need to stringify the body, just pass it as a "normal" object

answered Feb 24, 2019 at 21:19

Anton Sarov

3,7483 gold badges34 silver badges50 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

ypxo Over a year ago

Thanks for reply. If I pass body without JSON.stringify, it will send only empty request without any data.

Collectives™ on Stack Overflow

Angular http module - post headers

1 Answer 1

1 Comment

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Linked

Related