Question

Iam having some serious trouble parsing data from Giantbomb. I’ve tried almost every trick in my book to parse the data, but it either gives me Access Origin Null not allowed, or Unexpected : in the Javascript console. I’ve tried both doing this:

$.getJSON("http://api.giantbomb.com/search/?api_key=KEY&query=crash%20bandicoot&field_list=name,image&format=jsonp&json_callback=gamer", function(data) {
console.log(data)
});

And without the JSONP stuff:

$.getJSON("http://api.giantbomb.com/search/?api_key=KEY&query=crash%20bandicoot&field_list=name,image&format=json", function(data) {
console.log(data)
});

Nothing seems to be working – at all. And Google doesn’t seem to have any answers either. Does anybody have a clue what to do?..

My goal is to get cover art from games, so if there’s a better library out there – please let me know!

Answer 1

Two problems with what you’re doing:

1. If you put &format=jsonp into the URL, you’re still not making a JSONP request when you issue it with $.getJSON. Any $.getJSON calls will just get errors that the call is not allowed due to Access-Control-Allow-Origin. You need to use $.ajax and set dataType to JSONP.

2. You have specified a JSON callback function called gamer. This is where you should be dumping out the data using console.log and doing anything else to parse the result.

Something like the following should work:

$(document).ready(function(){
        $.ajax({
          url: "http://api.giantbomb.com/search/",
          type: "get",
          data: {api_key : "KEYHERE", query: "crash bandicoot", field_list : "name, image", format : "jsonp", json_callback : "gamer" },
          dataType: "jsonp"
        });
});

function gamer(data) {
    console.log(data);
}