3

I am doing a call to a REST endpoint. I want to add a resource (below). However, when my service calls Http's post method it will invoke the request but the response's header(s) are not returned. At least, I experience an empty headers object of the Response instance. (??) I do expect response header. In particular I expect the Location header as part of a "REST ADD RESOURCE" pattern. The Location headers contains the URL of the newly created resource.

The weird thing about this: when I call my API directly (thus not via Angular2), I get the exact response but this time with (all) expected headers including the Location response header.

Uhh, is there something wrong with Http.post or am I doing something wrong?

Mind you: My service returns an Observable Response in this example. This is not the intended class type to return to the caller. I am using it for the convenience of understanding what is happening with the post response. In reality it is my intention to pass the url stored in the Location header. 

addModel(model: any): Observable<Response> {
let token = this.loginService.auth.accessToken;
let headers = new Headers({
  'Content-Type': 'application/json',
  'Accept': 'application/json',
  'Authorization': `Bearer ${token}`
});
let options = new RequestOptions({headers: headers});
let data: string = JSON.stringify(model);
return this.http.post(this.url, data, options)

  // .map(r => {
  //   console.log("Response ", r);
  //   return r.headers.get("Location"); // THERE IS NOTHING IN headers (?). Don't understand.
  // })
  .catch(err => Observable.throw(err));
 }
Günter Zöchbauer
  • 623,577
  • 216
  • 2,003
  • 1,567
user2120188
  • 427
  • 1
  • 4
  • 16
  • If its a CORS request the server needs to add `Allow-access-expose-headers` otherwise the returned headers won't be available to JS. Did you check in the browsers devtools if the response contains the headers? – Günter Zöchbauer Nov 09 '16 at 13:31
  • Hi Gunter, I had logged to console but did not see any header. I also used Postman to manually fire the request and I could see the headers in Postman. (But not in http.post of Angular2). I am going to checkout the CORS header you suggested. Most probably I also need to do some adjustment in the WSO2's API Manager. – user2120188 Nov 09 '16 at 13:39
  • Logging to the console doesn't help because it needs to be read using JS first which doesn't work (as mentioned). If it works from postman, than it's definitely a CORS issue. – Günter Zöchbauer Nov 09 '16 at 13:40

1 Answers1

7

With a CORS request the server needs to add Allow-access-expose-headers: headername otherwise the returned headers won't be available to JS.

You can investigate the request response in the browsers devtools (network tab AFARK) if the response actually contains the headers?

Günter Zöchbauer
  • 623,577
  • 216
  • 2,003
  • 1,567
  • Hi Gunter, I just checked how my CORS settings are on the API Gateway for this particular rest api. First of all, CORS is on. Currently some headers are configured to be allowed for the CORS request. (I added also Location , since it was not there ..(but I think this won't be necessary because the Location header belongs to a server response and not the request). Nothing changed. Btw, I dont have *Allow-access-expose-headers* but *Access-Control-Allow-Headers*. Is this an issue? – user2120188 Nov 09 '16 at 13:52
  • 1
    Yes it is an issue. `...expose-headers` is about exposing ;-) Did you investigate the reponse in the browsers devtools? You'll find the response there but JS won't expose it. – Günter Zöchbauer Nov 09 '16 at 13:54
  • http://stackoverflow.com/questions/40471271/cant-get-all-response-headers-from-angular-2-with-cors/40471695#40471695 – Günter Zöchbauer Nov 09 '16 at 13:54
  • Hi Gunter, yes I checked in DevTools and it turned out that the remote server (API) did send all expected headers under the condition of enabled CORS. I could see the Location header on the response in Chrome Devtools. So, all headers (Location) have reached my browser, but Angular's http instance does not pass them through, so I can't access them in my code. At the moment I am trying to configure WSO2 API Manager to include the CORS header that you suggested. Until now I was not successful in including it because I still does not see it in my response. I 'll do a post on the stackoverflow. – user2120188 Nov 10 '16 at 09:52
  • Sure, create a new question. I don't know about WSO2. – Günter Zöchbauer Nov 10 '16 at 09:53
  • 1
    Gunter, I was successful in configuring my API Gateway (WSO2) to include the suggested header (Access-Control-Expose-Headers) in the response. I did a test and Angular2's Http client picks up my Location header (visible). Your suggestion helped a lot!.Thanks. – user2120188 Nov 10 '16 at 11:19
  • You weren't easy to convince :D Glad to hear you could make it work. – Günter Zöchbauer Nov 10 '16 at 11:20