How do i use an API? getting nothing back in a AJAX(jQuery) request

Question

i am figuring out how i can use the tumblr api, but i think i maybe doing it wrong

i tried

$.get("http://jiewmeng.tumblr.com/api/read/json?callback=tumblr", function(data) {
    $("body").prepend(data);
});

and even $.ajax()

$.ajax({
    type: 'get',
    contentType: 'json',
    url: 'http://jiewmeng.tumblr.com/api/read/json',
    success: function(data) {
        alert(data);
    }
});

and i got nothing. but when i go to the url in the browser, i get something, whats wrong?

Answer 1

You shouldn't give a name to the callback function if you are using an anonymous callback. Leave the naming to jQuery using callback=?:

$.getJSON('http://jiewmeng.tumblr.com/api/read/json?callback=?', function(data) {
    alert(data);
});

This way the actual request will look something like this:

http://jiewmeng.tumblr.com/api/read/json?callback=jsonp1284885664340

Answer 2

Your get() call is missing the second parameter (the parameters to your call). So, your call should be something like:

$.get("http://jiewmeng.tumblr.com/api/read/json", {callback:'tumblr'}, function(data) {
  $("body").prepend(data);
});

I tested it, but it does not work here. My guess is that the call to http://jiewmeng.tumblr.com/api/read/json checks if the call is an AJAX request and returns nothing if that's the case.

Answer 3

Ajax only works on the same host as the page, if you want to call page (via ajax) on different host you must write php proxy, read this article.

You can also set dataType to "jsonp", this will fetch json request not by XHR but with script tag.