Send custom header with Angular 5

Question

I am trying to send a custom HTTP Header from the front end app for it to interact with the gateway. This is my angular function:

import {Http, Headers, Response, RequestOptions } from ‘@angular/http’;
getXById(id :number){
    let options = nee RequestOptions({ headers : new Headers({“X-fastgate-resource” :”resource_name}) });
    return this.http.get( http://url + “/resource”, options)

I expected to see a Header with, “X-fastgate-resource” as a key, and “resource_name” as value. What I got was this:

Request Headers:
   OPTIONS http://url HTTP/1.1
   host...
   Access-Control-Request-Headers: x-fastgate-resource 

Answer 1

You could try out something like below.

let headers = new HttpHeaders();
headers.append('X-fastgate-resource', 'Example');
let options = { headers: headers };
let apiUrl: string = 'http://url';

this.http.get(apiUrl, options);

Hope this helps