JSONP We found that calling js files on a Web page is not affected by whether it is cross-domain or not. All tags with the "src" attribute have cross-domain capabilities, such as , <img>, < ;iframe>. That is to say, if you want to access data across domains, the server can only put the data in js format files. It happens that we know that JSON can describe complex data concisely, and JSON is also natively supported by js, so the client can process data in this format almost as desired. Then the client can call the dynamically generated js format file on the cross-domain server in exactly the same way as calling the script. After the client successfully calls the JSON file, it obtains the data it needs. This forms the basic concept of JSONP. Users are allowed to pass a callback parameter to the server, and then when the server returns data, it will use this callback parameter as a function name to wrap the JSON data, so that the client can customize its own function to automatically process the returned data. </p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:js;toolbar:false">function dll(response){ alert(response.city); } var script=document.createElement("script"); script.src="http://freegeoip.net/json/?callback=dll"; document.body.insertBefore(script,document.body.firstChild);</pre><div class="contentsignin">Copy after login</div></div><p>Three steps: create script, specify src, and insert into document. </p> <p>jQuery supports JSONP calling. After specifying the callback function name in another domain name, you can use the following form to load JSON data. <br>url?callback=?<br>jQuery.getJSON(url + "&callback=?", function(data) { <br> alert(data.a + data.b); <br>});<br>Of course the server must also provide JSONP support , in fact, just provide the params of read and write callback. <br>Cross-Origin Resource Sharing (CORS) <br>Cross-Origin Resource Sharing (CORS) is a W3c working draft that defines how browsers and servers communicate when accessing resources across domains. The basic idea behind CORS is to use custom HTTP headers to allow the browser and server to understand each other and determine whether the request or response was successful. </p> <p>Compared with JSONP, CORS is more advanced, convenient and reliable. </p> <p>1. JSONP can only implement GET requests, while CORS supports all types of HTTP requests. <br>2. Using CORS, developers can use ordinary XMLHttpRequest to initiate requests and obtain data, which has better error handling than JSONP. <br>3. JSONP is mainly supported by old browsers, which often do not support CORS, while most modern browsers already support CORS. <br>For a simple request, without custom headers, either use GET or POST, its body is text/plain, and the request is sent with an additional header called Origin. The Origin header contains the headers of the requested page (protocol, domain name, port) so that the server can easily decide whether it should provide a response. <br>The server side supports CORS mainly by setting Access-Control-Allow-Origin. <br>Header set Access-Control-Allow-Origin * <br>In order to prevent XSS from attacking our server, we can restrict domains, such as <br>Access-Control-Allow-Origin: http://blog.csdn.net<br>Many services have been provided With CORS support, for example, AWS supports the cross-domain resource sharing function CORS, and no proxy is required for uploading to S3. </p> <p><br></p>