Angular: I am unable to set header for http post call

Question

I am trying to set header from http post call, But When I am consoling it to the log, It is printing undefined.

I tried the same for params also, but it is not getting set.

callAddGroupAPI(formId, data){
    const headers = new Headers()
    .set('Content-Type', 'application/json');
    console.log(headers);
}

I am expecting output in the console to log the value of headers, But it is print undefined.

I have also tried

callAddGroupAPI(formId, data){
    const headers = new Headers();
    headers.append('Content-Type','application/json');
    console.log(headers);
}

And this also is not working...

I am getting the same problem when I am using

const data = new FormData();
data.set('key', 'value')
console.log(data)

I have use .append() also, But that also is not working.

Doflamingo19 · Accepted Answer · 2019-11-21 08:51:47Z

3

This is an example how you set header in post request

create(custom: CustomObject): Observable<CustomObject> {
    const header = new Headers({ 'Content-Type': 'application/json' });
    return this.http.post(this.url, JSON.stringify(custom), { headers: header })....}

answered Nov 21, 2019 at 8:51

Doflamingo19

1,6395 gold badges17 silver badges36 bronze badges

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

Comments

Sawant Sharma · Accepted Answer · 2019-11-21 08:52:32Z

2

To use headers try this,

// define in your service.ts constructor
this.httpOptions = {
  headers: new HttpHeaders({ 'Content-Type': 'application/json', 'X-CSRFToken': csrf }),
};

// use 
this.http.post(yoururl, payload, this.httpOptions);

About formdata, when you do console.log() it'll just printFormData {}, to access the key do data.getAll('key') or use data.forEach

answered Nov 21, 2019 at 8:52

Sawant Sharma

7583 silver badges11 bronze badges

Comments

irudji · Accepted Answer · 2019-11-21 08:52:19Z

2

You can try this:

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

const httpOptions = {
  headers: new HttpHeaders({
    'Content-Type':  'application/json'
  })
};

And httpOptions pass in as parameter in your post request

myRequest (item: Item): Observable<Item> {
  return this.http.post<Item>(yourUrl, item, httpOptions)
}

answered Nov 21, 2019 at 8:52

irudji

2291 gold badge3 silver badges13 bronze badges

Collectives™ on Stack Overflow

Angular: I am unable to set header for http post call

3 Answers 3

Comments

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Related