Why is cross-domain JSONP safe, but cross-domainJSON not?

Question

I'm having trouble connecting some dots having recently learned of JSONP. Here's my understanding:

• Cross-domain XmlHttpRequests for any content (including JSON) is banned, due to the same origin policy. This protects against XSRF.
• You are permitted to have a script tag with a src that returns JSONP - some JSON padded inside a call to a Javascript function (say 'Foo')
• You can have some implementation of 'foo' on the page that will get called when the JSONP data is returned, and you can do things with the JSON data that function is passed

Why is it OK to receive cross-domain data if it came via JSONP, but not if it came via JSON?

Is there an assumption that JSON is prone to permitting XSRF but JSONP is not? If so, is there any reason for that other than JSONP being some de-facto data format that won't ever provide data that enables XSRF? Why JSONP and not some arbitrary root tag on XML instead?

Thank you in advance for your answers, please make my brain work again after failing to figure this one out.

Answer 1

I understand this question to be about why the browser considers JSONP safe, not about whether it is safe (which it isn't). I will address this question step by step.

Regular ol' AJAX

To perform a regular AJAX request, the browser creates an XHR object, points it at the URL and pulls the data. The XHR object will only trust data from the same domain. This is a hard limitation. There is no getting round it in current browsers (edit - you can now use CORS).

Solution - Don't use XHR

Since XHR is subject to the same domain poilicy, we can't use XHR to do cross domain AJAX. Luckily, there are other ways to hit a remote server. We could append an image tag to the page for example. We can also append a script tag and give it a src attribute that points to the remote server. We can pull JQuery from a CDN for example and expect it to work.

How JSONP works.

When we make a JSONP request, our code dynamically appends a script tag to the page. The script tag has a source attribute which points to the remote JSONP API url, just as though you were inserting a script from a CDN.

The JSONP script returned by the server is wrapped in a function call. When the script is downloaded, the function will be executed automatically.

This is why we have to tell the JSONP the name of the callback function we want to wrap the script in. That function will be called once the script has downloaded.

Security concerns

There are some fairly big security concerns here. The script you are downloading could take control over your page and put your users at risk. JSONP is not safe for your users, it is just not blocked by the web browsers. JSONP really is a browser exploit which we are taking advantage of. Use with caution.

Used wisely, JSONP is pretty awesome though.