Question

I am trying to access an API with javascript and jQuery, but I get a weird error.

$(document).ready(function() {
    var server = 'https://' + rand(10) + '.spotilocal.com:4371';
    $.getJSON(
        server + "/service/version.json?service=remote&_=" + new Date().getTime(),
        function(data) {
            if (data.version == 9) {
                $.getJSON(
                    server + "/simplecsrf/token.json?&cors=&_=" + new Date().getTime(),
                    function(data) {
                        console.log(data.toString());
                });
            }
    });

    function rand(length,current){
        // returns a random string
    }   
});

My error:

XHR finished loading: "https://rwhpxmubmi.spotilocal.com:4371/service/version.json?service=remote&_=1337093238805".
XMLHttpRequest cannot load https://rwhpxmubmi.spotilocal.com:4371/simplecsrf/token.json?&cors=&_=1337093239623. Origin http://example.com is not allowed by Access-Control-Allow-Origin.

The first request succeeds, but the second fails. But both files are on the same server and both files are JSON.

Does anyone know why I get this error and how to fix it?

Answer 1

You have to edit your headers on the files. One of them obviously has Access-Origin set properly, and the other one does not.

Check out this page.