jQuery $.getJSON Fail

Question

Why does the following fail:

var url = "http://www.nfl.com/liveupdate/game-center/2012080953/2012080953_gtd.json";

$.getJSON(url, function(json){

    $("#jsondata").text(json);

}).fail(function(error){

    $("#jsondata").text("fail: " + JSON.stringify(error, null, 4));

});

Here is the output: fail: { "readyState": 0, "status": 0, "statusText": "error" }

I json linted the url and it's valid. I just don't get it. I've used $.getJSON plenty without issues. I just can't seem to find the working solution to this. Is it the .json extension?

When I ran this in my browser console I got: `XMLHttpRequest cannot load http://www.nfl.com/liveupdate/game-center/2012080953/2012080953_gtd.json?_=1424830190095. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://stackoverflow.com' is therefore not allowed access.` Looks like nfl.com is smart and doesn't allow other sites to access their JSON. — Sumner Evans, Feb 25 '15 at 02:10
@jsve could you elaborate? If you copy and paste the link in your browser then you'll see the json data plain as day. Weird. — lucusp, Feb 25 '15 at 02:11
There's a python lib out there that uses this exactl link as an example. I know `python != javascript`, and i'm not familiar enough to know if I need server side code to access. Maybe? — lucusp, Feb 25 '15 at 02:14
@lucusp This is browser security. Read about [CORS](http://en.wikipedia.org/wiki/Cross-origin_resource_sharing) — Jack, Feb 25 '15 at 02:16
Try to look at this too. http://stackoverflow.com/questions/19395354/jquery-ajax-readystate-0-responsetext-status-0-statustext-error — dowomenfart, Feb 25 '15 at 02:17
@lucusp try pasting the code from your snippet into a browser console. You should get the error I mentioned. — Sumner Evans, Feb 25 '15 at 02:18
Thanks for all your help and resources. I'll start working on those now. — lucusp, Feb 25 '15 at 02:19

score 1 · Answer 1 · answered Feb 25 '15 at 03:10

I don't think the said resource is either supporting CORS or jsonp.... so they do not indent other sites to use the resource from browser.... one possible solution for you is to access the resource from your server and pass the response to your client(browser)...

ie from jQuery you sent the request to your server, from there using a http client(based on your server side technology) you sent a request to the said resource the then once you receive the response pass it back to your caller(browser)... (in this case your server will act as a proxy)

jQuery $.getJSON Fail

1 Answers1