jQuery get JSON response is empty

Question

I'm trying to get a simple jQuery get JSON call to work. Neither my success handler non error handler seems to be getting called. Firebug also shows the data body as empty.

The server is a very basic bit of code running under web.py. I've tested the server by connecting to it with lynx and it downloads the json data OK.

Here's the jQuery:

$(document).ready(function() {
    $.ajax({
        url: 'http://localhost:8080/settings.json',
        cache: false,
        success: function(json){
            alert('json success ' + json);
        },
        error: function(xhr, textStatus, errorThrown) {
            alert(xhr.statusText);
        }
    });
});

JSON data is:
{"netmask": "255.255.0.0", "ipaddress": "192.168.1.153"}

Answer 1

You can't make a request to another domain (that rule includes a different port) with an XmlHttpRequest, this is blocked by the same origin policy.

The result of trying to do this is an empty response, so you can't see the content. This is just a rule in place for security purposes...if you're connecting to the same host and port, it's a non-issue.

Answer 2

You can set up a reverse proxy in Apache that will make a remote data source look like it's coming from a local domain. I've written a blog post about how to do this:

http://senchabits.wordpress.com/2012/09/17/problem-accessing-json-data-from-a-local-data-source-is-not-permitted/