In this page, we will discuss JSONP, i.e. JSON with padding. JSONP is used to request data from a server residing in a different domain. But why do we need a special technique to access data from a different domain? It's because of the Same Origin Policy.
In general, this policy states that, if protocol (like http), Port number (like 80) and host (like example.com) is different from where data is being requested, it should not be permitted.
But HTML <script> element is allowed to perform content retrieval from foreign origins.
Step 1 - You need to create a callback function. The function accepts some data. Like following code :
Step 2 - Include a script in your web page which contains the callback function created a step 1 as a parameter.
Step 3 - It outputs a script which calls the function and requested data is passed.
JSONP has nothing to do with Ajax, since it does not use XMLHttpRequest. Instead, it dynamically inserts <script> tag into a webpage.
But if you are using Jquery to do this sort of a job, you got to use Jquery's Ajax utility. Something like following -
JSONP is mostly used to get data using RESTFull APIs(like Flicker).
View the output of above JSONP example in a separate browser window.
Help the community: