juherr
juherr

Reputation: 5740

Vanilla JS: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access

I'm trying to do a pretty simple request to another server. I see the expected response in inspection panel of chrome but the browser doesn't allow the request:

XMLHttpRequest cannot load http://search.maven.org/solrsearch/select?q=g%3A%22org.testng%22%20AND%20a%3A%22testng%22&rows=20&wt=json. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.

My file is just:

<!DOCTYPE html>
<html>
  <body>

    <div id="testng-version"></div>

    <script type="text/javascript">
    //<![CDATA[

    var xhr = new XMLHttpRequest();
    var url = "http://search.maven.org/solrsearch/select?q=g%3A%22org.testng%22%20AND%20a%3A%22testng%22&rows=20&wt=json";

    xhr.open("GET", url, true);
    xhr.onreadystatechange = function() {
      if (this.readyState == 4 && this.status == 200) {
        var resp = JSON.parse(this.responseText);
        document.getElementById("testng-version").innerHTML = resp.docs[0].latestVersion;
      }
    };

    xhr.send();

    //]]>
    </script>
  </body>
</html>

Browsing the web or similar questions on StackOverflow didn't help.

Upvotes: 0

Views: 2282

Answers (1)

imhotap
imhotap

Reputation: 2490

You need to setup (and learn about) CORS.

To expand a bit, the site you're attempting to access must send CORS headers. Since that's out of your control, what you can do is proxy the site on your web server.

Upvotes: 1

Related Questions