There are two types of situations:
1. Access between subdomains based on the same parent domain. For details, see taobao.com, jipiao.taobao.com, and promotion.taobao.com. They have the same parent domain taobao.com.
2. Access between pages based on different parent domains. See the following three domain domains: taobao.com, Baidu.com, and sina.com.cn. They have different parent domains.
Between them Cross-Origin The solutions include:
Solution 1:Server proxy
The page Js of Domain A needs to access the Link under Domain B to obtain data. This solution creates a proxy on the server side of Domain. Program (It may be any server program such as ASP or servlet). js on the page of Domain A directly calls the proxy program in this domain, the proxy program is responsible for sending the request to the link under Domain B and obtaining the data, and then returning the data to the JS page through proxy.
The access process is: JS under Domain A -- <proxy under Domain A -- <Link under Domain B
Example:
Step 1:
Domain: Http://Jipiao.taobao.com/test.htm
Javascript script on the page:
Step 2:
Complete the proxy program on the server side of Domain A (a servlet is assumed here). The pseudo code is as follows:
Copy code The Code is as follows:
Public class proxy extends ....... {
... Doget (........) {
Httpclient client = ......;
Getmethod get = new getmethod ("www.baidu.com/xxxxx.do"); // access the link of Domain B
Int statuscode = client.exe cutemethod (get );
If (statuscode! = Httpstatus. SC _ OK ){
Byte [] responsebody = Get. getresponsebody ();
String res = new string (responsebody );
Httpresponse. getwriter (). Write (RES); // return data to Domain
}
}
}
Solution 2: Use the script Tag:
Write an empty script tag in the head of the domain a page http://Jipiao.taobao.com/test.htm:
Copy code The Code is as follows:
<HTML <
<Head <
<SCRIPT id = "remotescript" type = "text/JavaScript" src = ""/<! --
<Head <
<Body <
<SCRIPT type = "text/JavaScript" <
VaR remotescript = Document. getelementbyid ("remotescript ");
Remotescript. src = "www.baidu.com/xxxxx.do"; // link of Domain B
Alert (remote. Test); // use JSON data returned by Domain B
Alert (F [0]);
// -- </Script <
</Body <
</Html <
Note: This scheme requires that the data returned by Domain B must be in a valid JSON format or JS file format. For example, the format of the data returned by Domain B is as follows:
VaR remote = {test: 'hello '};
VaR F = [2, 1];
Solution 3: Hide IFRAME and shared domain:
That is, write a hidden IFRAME on the page of the http://jipiao.taobao.com/yyyy.htm of the domain a page:
Copy code The Code is as follows:
<HTML <
<Head <
<Head <
<Body <
<SCRIPT type = "text/JavaScript" <! --
Document. Domain = "taobao.com ";
VaR remotehtml = Document. getelementbyid ("remotehtml ");
Remotehtml. src = "promotion.taobao.com/xxxx.htm"; // access the link of Domain B
VaR document = remotehtml. contentdocument; // you can use documentto operate the xxx.htm data on the page in Domain B.
// -- </Script <
<IFRAME id = "remotehtml" src = "" style = "diapay: none" style = "diapay: none"/<
</Body <
</Html <
Note: here the http://promotion.taobao.com/xxxx.htm page also needs to set document. Domain = "taobao.com", this method can work.
The IFRAME method is not suitable Cross-Origin Is set to document. domain can only be set to its own parent domain, rather than other domains. For example, jiapiao.taobao.com can only be set to document. domain = "taobao.com", not document. domain = "Baidu.com ";
The three solutions listed here have their respective advantages and disadvantages:
The advantage of the proxy solution is that it can be applied to almost all Cross-Origin And only one domain is required for development. The other domain can provide data of any type. The disadvantage is that this scheme passes through the intermediate proxy, so the latency may be slightly higher, and the load on the local server will be increased, and the Development workload will be slightly larger.
The script tag solution is very simple and can be done without a few lines of code. However, it has strict requirements on the format of returned data and can only be JSON data, for data in other formats, this method is useless.
Hiding IFRAME is also very easy. It can process any returned data format, but it only applies Cross-Origin Request, and other domains must be developed in concert, that is, you need to set document. domain.
Original post for details: http://blog.csdn.net/lovingprince/archive/2008/09/20/2954675.aspx
--------------------------------------------------------------------------------
--------------------------------------------------------------------------------
For JS Cross-Origin I would like to add a few more points:
Cross-Origin Simply put, the JavaScript code of website a tries to access website B, including submitting content and obtaining content; for example, you want to execute JS objects on a page of website B from website a, or use js to parse DOM elements on a page of website B in website.; this Cross-Origin The Application Scenario of access problems is generally to embed pages of different domains in IFRAME, or send Ajax requests to different domains;
For security reasons, Cross-Origin Access is forbidden by various browsers by default. However, the browser does not prohibit reference JS files in other domains on the page, and can freely execute the functions in the introduced JS files; I personally think this is crucial!
Whether Cross-Origin The judgment rule is to compare the three: domain name, protocol, port; if one of the three is different, it will appearCross-Origin Problems Cross-Origin The problem generally refers to the domain name is different, because this scenario has the highest probability and there are some ways to solve it; for example, the second-level domain name under the taobao.com domain mentioned above Cross-Origin Problem;
If the primary domain is different or the Protocol is different (for example, https and HTTP ), Cross-Origin For example, if the * .taobao.com domain wants to access the content in * .baidu.com domain, it is completely impossible to solve the problem from the Web terminal. It can only be solved through the server proxy solution;
Common page control DOM elements for different domains include:
Window. location can be set but cannot be read. Access to other location attributes and methods is prohibited;
Document. href can be set but cannot be read. Access to other document attributes and methods is prohibited;
<IFRAME <SRC can be set, but cannot be read;
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
