差异jsonp和简单获取请求（跨域）

Question

I have to send (and receive) certain data to a server using JQuery and JSON. Works so far, but not cross domain, and it has to be cross domain.

I looked how to solve this and found JSONP. As far as I see, using JSONP I have to send the callback and the data using GET (JQuery allows to use "POST" as method, but when I inspect web traffic I see it is sending actually GET and everyting as parameter).

JSONP also requires changes in the server, because they are expecting a POST request with JSON data, and they have to implement something to process the JSONP GET request.

So I'm wondering what's the difference between this and sending the data as key value parameters in GET request?

Is the difference the possibility to use a callback? Or what exactly?

Sorry a bit lost... thanks in advance

Answer 1

JSONP is not a form submission. It is a way of telling the server via a GET request how to generate the content for a script tag. The data returned is a payload of JavaScript (not just JSON!) with a function call to a callback which you (by convention) reference in the GET request.

JSONP works because it is a hack that doesn't use AJAX. It isn't AJAX and you should not confuse it for such because it does not use a XMLHttpRequest at any point to send the data. That is how it gets around the Same Origin Policy.

Depending on the browsers you have to support, you can implement Cross-Origin Resource Sharing headers on the server side which will let you use normal AJAX calls across trusted domains. Most browsers (IE8, Firefox 3.5+, etc.) will support CORS.

Another solution you can use if you don't want to use CORS or JSONP is to write a PHP script or Java servlet that will act as a proxy. That's as simple as opening a new connection from the script, copying all of the incoming parameters from your AJAX code onto the request and then dumping the response back at the end of your script.

Answer 2

I found an answer that worked for me with the cross-domain issue and JSON (not JSONP). I simply used:

header('Access-Control-Allow-Origin: *');

inside my json file (file.php) and called it like this:

var serviceURL = 'http://your-domain.com/your/json/location.php'
$.getJSON(serviceURL,function (data) {
   var entries = data;
   //do your stuff here using your entries in json
});

BTW: this is a receiving process, not sending.