Question

I was adding recent videos gadget on my blog. In that widget i was supposed to add this line

<script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs">

also, i added another script which was having the method showrecentpostswiththumbs [ used in callback ]. Please let me know what does above syntax do?

Edit
After Lord’s comment 🙂

Actually, my blog is hosted on blogspot.com. So from that point of view, if you will append /feeds/posts/default?orderby=published&alt=json-in-script to any blog url it will generate some code. I just wanted to know what does it do? and what happens to the method which is used in callback parameter [ regardless of what is the definition of callback method 🙂 ].

for eg: http://googleblog.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script

Answer 1

It’s impossible to tell just from what you’ve posted, but the parameter naming in the URL suggests JSONP.

The basics of JSONP are to allow cross-domain AJAX calls by wrapping otherwise-bare JSON objects in a function call, so that the result can be executed as a script.

JSON code:

function getJSON(url) {
    var xhr = new XHR(url); // pseudocode
    xhr.onsuccess = callback;
    xhr.send();
}

function callback(data) {}

JSON response:

{ "items" : [1, 5, 7] }

Equivalent JSONP code:

function getJSONP(url) {
    var script = document.createElement("script");
    script.src = url + "&callback=callback");
    script.type = "text/javascript";
    document.body.appendChild(script);
}

function callback(data) {}

JSONP response:

callback({ "items" : [1, 5, 7] })

Edit

JSONP it is. Compare the results of the following three requests:

• http://googleblog.blogspot.com/feeds/posts/default?orderby=published&alt=json
• http://googleblog.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script
• http://googleblog.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs

The first returns the feed as raw JSON, the second returns it as JSONP with a default callback name, and the third returns it as JSONP using the supplied name for the callback function.