How does jsonp work

JSONP could still work without it maybe the server could put the result in a standardized variable that the browser code knows about. Thanks, I have read a lot of articles to understand what happens with jsonp calls and your explanation is the best. Thanks for the feedback, David. I just got around to updating this post for better clarity and incorporated your suggestions. Let me know how it reads now. The policy disallows reading any responses sent by websites whose origins are different from the one currently used.

Incidentally, the policy allows sending a request, but not reading one. If you wish to learn more about this policy, look no further. But due to the aforementioned policy, the request would be blocked because the origins of the website and the server differ.

In this case, the returned code would be the JSON snippet shown above. In the returned code, a function is wrapped around the JSON object. The function name has to be passed by the client since the code is going to be executed in the browser.

The function name is provided in the query parameter called callback. Then we increment the jsonpID to make sure the function name is unique. Most people include a script tag to get jQuery hosted from Google rather than hosting it themselves. Something like this:. Notice that the domain is ajax. So way back in someone had the clever idea to take advantage of this caveat.

Next, add a script tag to your page which calls the API and passes it an additional parameter. Notice the additional parameter? If the remote site knows the structure of your code, it can perform arbitrary operations with that code, because you've opened your front door wide-open to allow that site to do anything it wants. Edit: As Jon said, there is a way better explanation for it here. JSONP uses script tags to make cross origin requests.

Since a script tag is used to include scripts, the server needs to return valid JavaScript. The way we give the JavaScript to the client is through a function call. You tell the server what function you want the script to call, and then you create that function locally. When the script is done loading, your function will be called with the data as a parameter.

The function name parseResponse is passed to the server and somehow the data returned becomes parameters to this function. How are we doing? Please help us improve Stack Overflow. Take our short survey. Stack Overflow for Teams — Collaborate and share knowledge with a private group.

Create a free Team What is Teams? Collectives on Stack Overflow.