Ajax fails but the call succeeds when I access the URL directly

Question

I'm making the following AJAX call from firebug:

var rootUrl = 'http://172.24.105.22:8080/geoserver/Chennai_Sub/ows';

var defaultParameters = {
    service: 'WFS',
    version: '1.0.0',
    request: 'GetFeature',
    typeName: 'Chennai_Sub:Link',
    maxFeatures: 200,
    outputFormat: 'application/json',
    format_options: 'callback: getJson'

};

$.ajax({
    url: rootUrl,
    data: defaultParameters,
    success: function () {
        console.log("victory");
    },
    error: function (XMLHttpRequest, textStatus, errorThrown) {
        console.log(textStatus);
    }
});

The AJAX call fails. This is some part of the response object I get:

readyState  4
status  404
statusText  "error"

But when I actually try to open the URL (http://172.24.105.22:8080/geoserver/Chennai_Sub/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=Chennai_Sub%3ALink&maxFeatures=200&outputFormat=application%2Fjson&format_options=callback%3A+getJson) in my browser, I get a clean JSON response. Any idea on what I'm doing wrong ?

(Also, I try the firebug session in this URL: http://172.24.105.22:3000/layer. So I don't think so this is the CORS problem.)

Answer 1

That might not be right solution, but I believe different ports might cause such problem.

From comment above

AJAX requests are allowed only in the same domain, protocol and port due to Same Origin Policy.

What Wikipedia says about that: http://en.wikipedia.org/wiki/Same-origin_policy

Answer 2

I couldn't access any of the URLs provided, maybe your server can't access them too, although your local computer might be able to? Make sure target URL is accessible from your website. Also, if you're calling the AJAX request from the same server as the target one, I would suggest using relative URL instead of absolute one.

Another option, if the above doesn't work, is to use the $.get request of jQuery instead of $.ajax.

$.get('http://172.24.105.22:8080/geoserver/Chennai_Sub/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=Chennai_Sub%3ALink&maxFeatures=200&outputFormat=application%2Fjson&format_options=callback%3A+getJson', function(response) {
console.log(response);
})

Or

$.get('http://172.24.105.22:8080/geoserver/Chennai_Sub/ows', defaultParameters, function(response) {
console.log(response);
})

Answer 3

Well, for a start thats a 404 which means that the the client was able to communicate with the server, but the server could not find what was requested. So just make sure that theres actually a route to for that rootURL.