Can't read response data and headers in an AngularJS interceptor - angularjs

Question

I have an API in my server that sends a custom header (lets name it "customHeader") that responds to http://localhost:8081/my/test/api.
I'm trying to read that custom response header from an interceptor in angularJS:
angular.module('oauth.interceptor', []).factory('readResponseHeader', ['$q',
function ($q) {
return {
response': function(response) {
console.log("response: %o", JSON.stringify(response));
console.log("headers: %o", response.headers());
return response;
}
}
}
]);
But all I get are empty data and headers in response. The console log shows the following json as response:
{
"data": [],
"status": 200,
"config": {
"method": "POST",
"transformRequest": [
null
],
"transformResponse": [
null
],
"url": "http://localhost:8081/my/test/api",
"data": {
"example": "request data"
},
"headers": {
"Accept": "application/json, text/plain, */*",
"Content-Type": "application/json;charset=utf-8",
"Authorization": "Bearer XXXXXXXXX..."
},
"cached": false
},
"statusText": "OK"
}
And the following as headers:
{
"content-type": "application/json; charset=UTF-8"
}
I expected my customHeader to be there, and be able to read it with something like:
response.headers().customHeader
But it clearly isn't there (in fact, many other headers are missing!).
How am I supposed to read it?

Answer 1

I finally found the problem wasn't really in the AngularJS part, but on the server side part.
The point is that, to be able to access the header, the server must add the Access-Control-Expose-Headers header containing the name of the custom header, something like this:
Access-Control-Expose-Headers: customHeader