What is wrong with my HTTP over AJAX (javascript)

Question

My code: var answer_array = [];

var req = new XMLHttpRequest();
req.onload = function() {
    answer_array = answer_array.concat(JSON.parse(this.responseText).results);

    console.log(answer_array);

}

req.open("GET", "https://api.comettracker.com/v1/gpsdata?fromdate=2015-10-13");
req.setRequestHeader("authorization", "Basic Base64 encoded credentials");
req.setRequestHeader("cache-control", "no-cache");
req.setRequestHeader("postman-token", "b94725ff-408b-c82e-a985-6c38feb380af");
req.send();

This is what is in my console: scripts2.js:22 OPTIONS https://api.comettracker.com/v1/gpsdata?fromdate=2015-10-13 (anonymous function) @ scripts2.js:22 2015-10-21 12:41:09.059 index.html:1 XMLHttpRequest cannot load https://api.comettracker.com/v1/gpsdata?fromdate=2015-10-13. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. The response had HTTP status code 405.

When I go to the network tab on Chrome I see this: gpsdata?fromdate=2015-10-13 OPTIONS 405 xhr scripts2.js:22 0 B 452 ms

stackoverflow.com/questions/10636611/… answers your question — Akshendra Pratap
– Akshendra Pratap, Commented Oct 21, 2015 at 17:10
No, and yes: It means its a server side thing. if you have acces to the server side code youll have to place the 'fix' there — jstuartmilne
– jstuartmilne, Commented Oct 21, 2015 at 17:33

jfriend00 · Accepted Answer · 2015-10-21 18:11:46Z

1

This error message:

No 'Access-Control-Allow-Origin' header is present on the requested resource

means that you are running into a cross origin permission issue which means that you are trying to access a site that does not permit access from the domain that your page is on. If your page is on your local drive being accessed with a file:// URL, then the first thing you can do is to put it on an actual web server and try it there since file:// URLs have some additional restrictions on them.

If that doesn't work either, then the issue is that the api.comettracker.com site is not allowing access from your particular site.

When I put your code into a jsFiddle and try it there and look at the network trace, what I see there is that the OPTIONS method which is used to pre-flight a cross origin request is being rejected by api.comettracker.com which tells the browser the cross origin request as currently formatted is not permitted.

I get a different error if your custom headers are removed from the request so I think that there's something incorrect about your custom headers. Since I don't know that particular API, don't have your access credentials or know how to use them, I don't know what exactly to suggest for the headers, but I think that's the place to start.

edited Oct 21, 2015 at 18:11

answered Oct 21, 2015 at 17:51

jfriend00

711k104 gold badges1.1k silver badges1k bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Vanessa Torres Over a year ago

Do you think that if I run my javascript without the browser like in "batch", I will have the same problem? I have made HTTP over AJAX before but is my first time with Basic Authentication.

jfriend00 Over a year ago

@VanessaTorres - Only the browser has cross origin protections. So, if you run your script in some other Javascript environment (such as node.js), it will not have this cross origin issue.

Vanessa Torres Over a year ago

Thank you for your help. Another question when I tried to run this using node.js I'm receiving this message and I have no idea what can be? var req = new XMLHttpRequest(); ^ ReferenceError: XMLHttpRequest is not defined at Object.<anonymous> (/Users/vanessa/Desktop/APIClient/scripts/scripts2.js:10:19)

jfriend00 Over a year ago

@VanessaTorres - there is no XMLHttpRequest in node.js. That is a browser-specific object. You would probably want to use the request() module in node.js to make the request or you could just use the http module (though the request module has more features for this). There is even a module that makes an XMLHttpRequest object in node.js if you want to go that way.

Vanessa Torres Over a year ago

I appreciate your help!

Collectives™ on Stack Overflow

What is wrong with my HTTP over AJAX (javascript)

1 Answer 1

5 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related