well guys I spend almost a whole day to get data from api call…
when i pass the url and header data(API key and value) in postman… it is working fine but when i pass the data in ionic http request… it is returning me the same error all the time…
401 - Unauthorized: Access is denied due to invalid credentials.
I am passing my authorization data in header but somehow the error is still there… this is my code
let headers = new Headers();
headers.append(‘JsonOdds-API-Key’, ‘ae0294c7-3f2a-485c-a541-417196ea6416’);
let options = new RequestOptions({ Headers: headers });
return this.http.get(‘https://jsonodds.com/api/odds’, options).map(res => res.json());
tell me what am i doing wrong in my ionic code… cox I am getting data from postman by passing the link and header token data…
Please correct to below and try(headers with small h)
let options = new RequestOptions({ headers: headers });
Ashley
Thanks ashley for the response…
there is still a problem after updating the line…
XMLHttpRequest cannot load https://jsonodds.com/api/odds. Response for preflight has invalid HTTP status code 401
can you please tell me what is the exact issue 
Does this happen when running on an actual device?
right now I am trying on browser rapropos… and also I have to give the end project as a web app not mobile app… that is why trying on browser…
other http get request are working fine however in this http request I have to set header for passing key and somehow it is giving this error
Then I’ve got some really bad news for you. If the backend server doesn’t support sending proper Access-Control-Allow-Origin headers (as described in here), you might be SOL in a browser environment.
What should i do for this @rapropos 
here is the exact error message i receive…
When I check this on postman or through curl… the Api is returning proper data to me…
Are you doing an OPTIONS request (not GET or POST) in Postman or curl to do what is called a “preflight request”?
CORS has a rather complex definition of what it considers a “simple request”, and anything that doesn’t meet it triggers an automatic preflight at a level below ordinary client code control. That nonstandard “JsonOdds-API-Key” header, which I assume is required to access the backend, DQs any request including it from being considered “simple”.
Well I tried get in postman @Sujan and simply added the required key in header… and it works fine their… but adding header here is not helping me
why the same jsonOdds-API-Key works fine on postman and curl @rapropos
Of course GET works. But because of security stuff, the client first tries a preflight, OPTIONS request to the URL. Only when this is answered correctly (status code 401 is not correct for example) the real request will go out.
Is there a way to move out of this issue guys? I almost wasted complete day on this
Quick and dirty fix: Write a proxy that you host on your server that receives a request and just forwards it to that server. You can add whatever header you want, then.
hmmmmm ok i will try this … thanks for the time guys 
Because you’re not actually doing what the browser is doing. Try this:
$ curl -H "Origin: http://www.somewhere.net" -H "Access-Control-Request-Method: GET" -H "Access-Control-Request-Headers: X-Requested-With" -X OPTIONS https://jsonodds.com/api/odds
You should get a 401. Now try the same thing with a backend that properly handles CORS:
$ curl --verbose -H "Origin: http://www.somewhere.net" -H "Access-Control-Request-Method: GET" -H "Access-Control-Request-Headers: X-Requested-With" -X OPTIONS http://ip.jsontest.com/
You should get a 200 with an Access-Control-Allow-Origin: * header. This is how things are supposed to work.
Change to a backend that properly implements CORS (like @Sujan12’s proxy suggestion) or give up on having this work in a browser context.
Googled a bit, there are ready made proxies and even hosted versions:
http://anyorigin.com/
Thanks @Sujan12… I will definitely try it
I feel like it’s worth mentioning that CORS exists for really good reasons beyond “making your life miserable”, and subverting it should only be done after a lot of careful research, thought, and planning and in as constrained a way as possible.
Blindly setting up unsecured proxy servers is not a great idea, and may even expose you to ToS violations of hosting services and/or upstream backends, including legal liability.
Before going down this route, I would first try contacting technical support for the backend service and explaining to them that you are having CORS trouble with their service. They should be able to fix this.
1 Like
