Unknown error on using .ajax() to get JSON

Question

Ok, I'm trying to get a JSON file from a URL with the following jQuery code.

$.ajax({
    url: 'http://example.com/example.json',
    dataType: 'json',
    type: 'GET',
    async: true,
    cache: true,
    crossDomain: true
});

However, when the request fires, Firebug indicates that an error occurred but doesn't tell me what it was.

I can get to the URL in my browser with no problems and the JSON is perfectly valid (according to http://www.freeformatter.com/json-validator.html).

Any suggestions?

EDIT:

Ok, changing the contentType to jsonp has gotten me a step further. My JSON looks like this (http://pastebin.com/hSAP30zv), but Firebug is saying:

SyntaxError: invalid label
"item" : {
^

Any more suggestions?

Test it on chrome and check console, maybe error message will be more accurate. — A. Wolff
– A. Wolff, Commented May 5, 2013 at 10:15
How are you hoping to achieve crossDomain? If you're hoping to use JSONP, you need to emit a JSONP response rather than JSON. If you're using CORS, you should pass xhrFields: { withCredentials: true } instead (api.jquery.com/jQuery.ajax) — Matt
– Matt, Commented May 5, 2013 at 10:20
I'm not sure how well dataType: 'json' and crossDomain: true work together. You only need to use crossDomain: true if you want to enforce cross-domain behavior on the same domain. So, I assume that you actually really make a cross-domain request, which returns JSON. That won't work unless the server supports CORS. Or it has to return JSONP and you have to tell jQuery to expect JSONP with dataType: 'jsonp'. — Felix Kling
– Felix Kling, Commented May 5, 2013 at 10:21
dataType:'jsonp' did it. Now it's giving trouble parsing JSON? — Natalie Rose
– Natalie Rose, Commented May 5, 2013 at 10:26
Because the server does not seem to return JSONP. You cannot make a cross-domain request if the server does not support it. As I said, it must either support CORS, in which case it acts just like a server on the same domain, or it must return JSONP, which is not the same as JSON. That's why you get the error. If you don't have control over the server, you have to create a proxy on your side, i.e. connect with Ajax to your server and let the server make the request to the external server. — Felix Kling
– Felix Kling, Commented May 5, 2013 at 10:45

palaѕн · Accepted Answer · 2013-05-05 10:26:33Z

This error handler, might help you:

$.ajax({
    url: 'http://example.com/example.json',
    dataType: 'json',
    type: 'GET',
    async: true,
    cache: true,
    success: function (html) {
        alert('successful : ' + html);
    },
    error: function (jqXHR, exception) {
        if (jqXHR.status === 0) {
            alert('Not connect.\n Verify Network.');
        } else if (jqXHR.status == 404) {
            alert('Requested page not found. [404]');
        } else if (jqXHR.status == 500) {
            alert('Internal Server Error [500].');
        } else if (exception === 'parsererror') {
            alert('Requested JSON parse failed.');
        } else if (exception === 'timeout') {
            alert('Time out error.');
        } else if (exception === 'abort') {
            alert('Ajax request aborted.');
        } else {
            alert('Uncaught Error.\n' + jqXHR.responseText);
        }
    },
    crossDomain: true
});

Vsevolod · Accepted Answer · 2013-05-05 10:26:06Z

1

Try to handle the error of the function fail:

$.ajax({
    url: 'http://example.com/example.json',
    dataType: 'json',
    type: 'GET',
    async: true,
    cache: true,
    crossDomain: true
}).fail(function(jqXHR, textStatus) {
  alert( "Request failed: " + textStatus );
});

answered May 5, 2013 at 10:26

Vsevolod

3754 silver badges11 bronze badges

Collectives™ on Stack Overflow

Unknown error on using .ajax() to get JSON

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related