Angular ajax - Request header field Content-Type is not allowed by Access-Control-Allow-Headers in preflight response

Question

I have the following code to create a post request from angular 6 to my webservice.

const headers = new HttpHeaders({
      'Content-Type': 'application/json' });
const headeroptions = { headers: headers };
return this.http.post(this.config.productsUrl + '?' + this.common.queryBuilder(options), {data: 'test'}, headeroptions);

It shows results in browser network pannel,but shows error in console like

Request header field Content-Type is not allowed by Access-Control-Allow-Headers in preflight response.

Answer 1

You need to add the your hostname in allowed CORS of the api.