title: Angular 2 as well as Angular 4 HTTP service call with Headers showing 403
body: <p>I am using angular 2 HTTP service call in my application. In this call I am using URL of my colleague's machine on which tomcat is running. This API call requires some headers as credentials, these headers also i have added in my code. Same API is <strong>working fine in <a href="https://chrome.google.com/webstore/detail/postman/fhbjgbiflinjbdggehcddcbncdddomop?hl=en" rel="nofollow noreferrer">Postman</a></strong> with same headers but while calling API from angular code its not working. Earlier it was showing error for CORS, to resolve it I used browsers <a href="https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi" rel="nofollow noreferrer">CORS extension</a>,now its showing me 403 i.e. access forbidden. </p>
  
  <p>Here is my code:</p>
  
  <p>import section:</p>
  
  <pre><code>import { Http, RequestOptionsArgs, Headers, RequestMethod, RequestOptions } from '@angular/http';
  </code></pre>
  
  <p>constructor:</p>
  
  <pre><code> constructor(private http: Http, private deviceService: Ng2DeviceService, private options: RequestOptions) { }
  </code></pre>
  
  <p>API call in <code>onInit()</code></p>
  
  <pre><code> ngOnInit() {
     let headerObj: RequestOptionsArgs = {
          method: RequestMethod.Get,
          url: "http://PC-NAME:8091/gateway/brand/poc",
          headers: new Headers({
              "SM_USER": "USER-ID@domain.com",
              "SM_USERUID": "USER#ID"
          }
          ),
      };
      this.http.get("http://PC-NAME:8091/gateway/brand/poc", headerObj).subscribe(res =&gt; {
          console.log(res.json())
      })
  }
  </code></pre>
  
  <p>I have mocked credentials in above code. I think there is mistake in code or somewhere I am missing something as in Postman URL and headers working fine API cannot be wrong. If anyone can help me, it will be really helpful. Thank you.</p>
  
  <hr>
  
  <p>I have also tried the Angular 4 way of HttpClient still no use... problem still persisting as it is. Here is angular 4 code</p>
  
  <pre><code> this.httpClient.get("http://infom-lap120:8091/gateway/brand/poc", {
          headers: new HttpHeaders({
              "Content-Type": "application/json",
              "SM_USER": "Sujay.Anjankar.consultant@nielsen.com",
              "REPORT_SERVICE_TENANT_ID": "coop",
              "SM_USERUID": "44f4c95c01dcb2ed99d30c30965072a0"
          })
      }).subscribe(
          // Successful responses call the first callback.
          data =&gt; { },
          // Errors will call this callback instead:
          err =&gt; {
              console.log('Something went wrong!');
          })
  </code></pre>
  
  <p>All necessary steps are exactly same to this doc : angular.io/guide/http#headers</p>