Step Python3 (11)--6--Ajax for cross-domain request JSONP and Cors

Source: Internet
Author: User
Tags script tag

How do AJAX operations implement cross-domain requests? Ajax (XMLHttpRequest) requests are limited by the same-origin policy. Ajax is able to interact with remote servers through XMLHttpRequest, and XMLHttpRequest is a purely JavaScript object, and the interactive process is done in the background, and the user is not easily aware. as a result, XMLHTTP has actually breached the security limitations of the original JavaScript. As an example:Suppose a website references JavaScript from another site, the site is hacked and added to JavaScript to get user input and submitted to other sites via Ajax, so that information can be collected continuously. or a Web site because of a vulnerability causes XSS to inject JavaScript script, the script can be AJAX to obtain user information and through Ajax to other sites, so that the continuous collection of information.           if we want to take advantage of XMLHTTP's non-flush asynchronous interaction capabilities and are reluctant to break through JavaScript's security strategy, the alternative is to give XMLHTTP a strict homology limit.           Such a security policy is similar to the security policy of an applet. The limitations of the IFRAME are also simply the inability to access data in cross-domain htmldom, while XMLHTTP essentially restricts the submission of cross-domain requests. (In fact, it is mentioned below that Cors has relaxed the restrictions)          with the development of AJAX Technology and Network service, the requirement of cross-domain is more and more strong. The following describes the cross-domain technology of Ajax. (1) JSONP (JSON with Padding)       JSONP (JSONP is a "usage pattern" of JSON), using the SRC attribute of the script tag (the browser allows the script tag to cross the domain). We know that the <script> tag can load a cross-domain JavaScript script, and that the loaded script and the current document belong to the same domain. The data and functions in the script can therefore be called/accessed in the document. If the data in the JavaScript script is generated dynamically, the data interaction with the server can be implemented as long as the <script> tags are dynamically created in the document. Jsonp is the ability to access cross-domain data using the cross-domain capabilities of <script> tags, requesting dynamically generated JavaScript scripts to take a callback function name as a parameter. The JavaScript function where the callback function is the local document, the server-side dynamically generated script generates the data and calls the callback function in the code with the resulting data as parameters. When this script is loaded into a local document, the callback function is called.
Here need to be clear: the so-called domain is not related to JS storage server, such as Baidu.com page loaded google.com js, then this JS domain is baidu.com instead of google.com. In other words, this JS can manipulate the Baidu.com Page object, and cannot manipulate the Google.com Page object.
If you're not sure, here's a more detailed explanation: because JS introduced through the script tag is not limited by the same Origin policy(as mentioned in the previous article baidu.com page loaded google.com js). So we can use the script tag to introduce a JS or a different suffix form (such asPHP, JSP, etc.), this file returns a call to a JS function, such as returning Jsonp_getusers (["Paco", "John", "Lili"]), which means that the result of this file return calls the Jsonp_getusers function, and the [" Paco "," John "," Lili ", this [" Paco "," John "," Lili "] is a list of users. So if there is a jsonp_getusers function in our page at this point, then Jsonp_getusers is called and the user list is passed in. This enables the ability to get additional domain data in the domain, that is, cross-domain.  eg:This domain is baidu.com <script> function jsonp_getusers (users) {Console.dir (users); } </script>//load google.com getusers.php <script src= "http://www.google.com/getUsers.php" >google.com is required to provide support, getusers.php code is as follows:<?php> Echo ' Jsonp_getusers (["Paco", "John", "Lili"]) ';//returns the invocation of a JS function?>Why is the file introduced by the script tag not limited by the same-origin policy? Because the file content introduced by the script tag cannot be obtained by the client's JS, it does not affect the security of the referenced file, so it is not necessary to make the file introduced by the script tag conform to the browser's homologous policy. And the content of the file loaded by Ajax can be obtained by the client JS, so Ajax must follow the same-origin policy, otherwise the contents of the introduced file will be leaked or there are other risks.   The disadvantage of JSONP is that it only supports get requests and does not support other types of HTTP requests such as post. However, a general GET request can perform all functions.
 Jsonp is easy to implement, but there are some security implications, and if a third-party script executes arbitrarily, it can tamper with the page content and intercept sensitive data. But Jsonp is the right choice for passing data on both sides of a trusted side. You can see that the JSONP cross-domain is typically used to get data from other domains.

It is generally possible to implement cross-domain Jsonp with JSONP, which is also the most cross-domain method used in front end.

   (2)CORS (Cross origin resource sharing,that is, cross-domain resource sharing)

By adding an extension field to the HTTP header, the server adds a field to the header of the corresponding Web page that represents the domain and HTTP method to allow access, and the client checks whether its domain is in the Allow list and decides whether to process the response. The Cors protocol improves the cross-domain capabilities of Ajax, but it also increases the risk. Once the website is injected into a script or XSS attack, it is very convenient to get the user information and pass it quietly.
Suppose our page or application is already on the http://www.test1.com, and we intend to extract the data from the http://www.test2.com request. In general, if we use AJAX directly to request it will fail, the browser will return a "source mismatch" error.
With CORS, just add a header on the http://www.test2.com to allow requests from http://www.test1.com, which is my hander () setting in PHP, "*" Indicates that any domain is allowed to submit requests to our server:
header (' access-control-allow-origin:* ');
You can also set the specified domain name, such as the domain name http://www.test2.com, then allow requests from this domain name:
      Header (' access-control-allow-origin:http://www.test2.com ');



From for notes (Wiz)



Step Python3 (11)--6--Ajax for cross-domain request JSONP and Cors

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.