10 Cross-Origin Resource Sharing methods and implementation principles (1/2)

10 Cross-Origin Resource Sharing methods and implementation principles
There are many cross-origin methods. We can find the most suitable solution for different application scenarios. For example, for one-way data requests, we should prioritize jsonp or window. name, two-way communication we adopt cross frame. We can also use server proxy to capture data without reaching a communication protocol with the data provider.

Same-origin policy
In client programming languages, such as webpage special effects and actionscript, the same-source policy is a very important security concept, which has an important significance in ensuring data security. The same-origin policy specifies that scripts in different domains are isolated. Scripts in one domain cannot access and operate most of the attributes and methods in another domain. So what is the same domain and what is different domain? When two domains have the same protocol (such as http), the same port (such as 80), and the same host (such as www.111cn.net), we can think that they are the same domain. For example, dig, https Tutorial: // www.111cn.net, http://www.111cn.net: 8080, any two in the http://sub.111cn.net will constitute a cross-domain. The same-origin policy should also handle some special situations, such as limiting the access permissions of scripts under the file protocol. Local html files are opened through the file protocol in the browser. If the script can access any other files on the hard disk through the file protocol, security risks may occur, at present, ie8 still has such risks.

Cross-Origin Resource Sharing is restricted by the same-origin policy. However, with the development of practices and browsers, we have gained a lot of valuable experience in cross-origin request skills. Here I divide cross-origin resource sharing into two types: one is one-way data requests and the other is two-way message communication. Next, I will list some common cross-origin methods. The source code of the following cross-origin instances can be obtained from here.

Unidirectional cross-origin
Jsonp
Jsonp (json with padding) is a simple and efficient cross-origin method. The script tag in html can load and execute javascript in other domains, therefore, we can dynamically load resources in other domains using script tags. For example, if I want to load the data of domain B from the pagea page of domain a, then in the pageb page of domain B, I declare the data required by pagea in the form of javascript, then, in pagea, use the script tag to load pageb, and the script in pageb will be executed. Jsonp adds a callback function. After pageb loads the function, it executes the function defined in pagea. The required data is passed to the function in the form of parameters. Jsonp is easy to implement, but it also has some security risks. If a third-party script is executed at will, it can tamper with the page content and intercept sensitive data. However, jsonp is a perfect choice for both trusted parties to transmit data.

Flash urlloader
Flash has its own security policy. The server can use crossdomain. an xml file is used to declare which domains can be accessed by swf files. swf can also use APIs to determine which domains can be loaded by swf files. When cross-origin resource access, for example, requests data from the domain www.a.com to the domain www. B .com, we can use flash to send http requests. First, modify crossdomain. xml on the domain www. B .com (usually stored in the root directory, if not manually created) and add www.a.com to the whitelist. Second, send http requests through flash urlloader, and finally pass the response results to javascript through flash api. Flash urlloader is a common cross-origin solution. However, if you need to support ios, this solution is powerless.

Homepage 1 2 Last page