Understanding differences in Response headers

Question

I need some insights understanding the following: I try to make calls to an external API where I don't have control on server. Vendors provide me with a static X-Auth-Token.

Using a PHP script I'm able to retrieve JSON array as expected:

$headers = array();
$headers[] = 'X-Auth-Token:myValidKeyString';
curl_setopt($ch, CURLOPT_HTTPHEADER, $headers);

Now I would like to access the API from client side with Ajax call and maybe embed that in Angular. but Here is what I get.

When Using a testing module (DHC by Restlet in Chrome) get request works and return 200 and the following Response Headers:

Cache-Control:no-cache, no-store, max-age=0, must-revalidate
Connection:keep-alive
Content-Type:application/json;charset=utf-8
Date:Fri, 03 Feb 2017 08:21:49 GMT
Expires:0
Pragma:no-cache
Server:Apache-Coyote/1.1
transfer-encoding:chunked
X-Application-Context:application:qa:8080
X-Content-Type-Options:nosniff
X-Frame-Options:DENY
X-XSS-Protection:1; mode=block

With following Request header:

Accept:*/*
Accept-Encoding:gzip, deflate, sdch, br
Accept-Language:en-US,en;q=0.8,fr;q=0.6
Connection:keep-alive
DNT:1
Host:myApihost.com
User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.95 Safari/537.36
X-Auth-Token:my-key-string

Then using the following function

$.ajax({
    type: 'GET',
    url: 'myApihost.com',
    headers: {'X-Auth-Token' : 'my-key-string'},
    success: function (dxddata) {
        console.log(dxddata);
    }
});

Status turn to 401 with Response Headers:

Cache-Control:no-cache, no-store, max-age=0, must-revalidate
Connection:keep-alive
Content-Length:55
Content-Type:application/json;charset=utf-8
Date:Fri, 03 Feb 2017 08:58:25 GMT
Expires:0
Pragma:no-cache
Server:Apache-Coyote/1.1
X-Content-Type-Options:nosniff
X-Frame-Options:DENY
X-XSS-Protection:1; mode=block

and request headers to :

Accept:*/*
Accept-Encoding:gzip, deflate, sdch, br
Accept-Language:en-US,en;q=0.8,fr;q=0.6
Access-Control-Request-Headers:x-auth-token
Access-Control-Request-Method:GET
Connection:keep-alive
DNT:1
Host:myApihost.com
Origin:null
User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.95 Safari/537.36

How can I have in and call the header X-Auth-Token:my-key-stringpassed properly?

Not I disable the CORS control to avoid Cross Origine error at this point.

score 0 · Answer 1 · answered Feb 03 '17 at 09:29

0

CORS need to be handled on server that host apis. You can't bypass this security restriction by yourself on the client. If you want to make a test ON YOUR MACHINE, you can try to install a CORS chrome extension like this https://chrome.google.com/webstore/detail/cors-toggle/omcncfnpmcabckcddookmnajignpffnh. Otherwise you need to make the call from your server side.

answered Feb 03 '17 at 09:29

Francesco De Rosa

104
6

Thanks @Francesco, I already use this extension. It prevent me to fight against the cross origin policy. My issue here is how to pass the `"X-Auth-Token"` as header keywords. As currently it ends in `Access-Control-Request-Headers` – Benoit Feb 03 '17 at 10:46

Understanding differences in Response headers

1 Answers1