Closing minutes 2. troubleshooting of cross-domain Ajax access between different subdomains

After opening a header for my last closed-off minutes, I continued to close my research. Although most of the things I studied were very promising, I also expected to publish the source code, however, there is not yet a complete introduction. A few days ago, I suddenly had an idea when solving my website performance problems, it can solve the problem of subdomain name cross-origin that I have always wanted to solve. I think I should share it with you. I don't know if anyone has used it.

The problem is described as follows: I personally use ajax to call interfaces similar to JSON or rest. These interfaces transmit data through the script tag, however, the problem is that data can only be loaded asynchronously.ProgramThe architecture is not as convenient as directly using the XML or text file synchronous access mode (xml http request). However, if the xml http request mode is used, in this way, the page and XML service must be deployed on the same domain name, even the sub-domain name of the same domain name will not work.

If I want to pass the Ajax pattern by the http://www.dituren.cn/page onCodeIs there a way to access the http://51ditu.dituren.cn/XML or text service above?

Maybe you can solve this problem by setting document. domain on the page, but this is a waste of time. I have already studied it, and this won't work! On the HTML page, why? Because the Domain Name: document. domain = 'dituren. CN '; in this way, they are in the same domain, but when the page accesses XML, XML obviously does not set its own domain, so cross-origin access will be generated, the user receives a prompt "no permission.

Since so, I think, why don't you use a proxy page above the http://51ditu.dituren.cn/to set your own document. domain = 'dituren. CN ', and the webpage in the WWW domain loads this page through IFRAME and sets its own domain. In this way, the communication between the two pages is smooth, the proxy page is in the 51ditu domain, so you can certainly access the XML service in the domain.

The above ideas have been tested by me (IE6, IE7, ff3) and are fully available! Therefore, if you have understood what I mean or do not need this technique for the time being, you can stop looking down. If you want to refer to my specific usage methods, you can look down, maybe it will inspire you.

Let's take a look at the code on the proxy page:

 

1 < Html >
2 < Head >
3 < Script Language = "JavaScript" >
4 // This function is run during page loading.
5 Function Onload ()
6 {
7 Document. Domain = " Dituren.cn " // Set your own domain
8 VaR Hash = Location. Hash; // The parent window uses the anchor parameter to pass a callback function name.
9 If (Hash && Hash. Length > 1 ) // If the callback function name exists
10 {
11 Hash = Hash. substring ( 1 );
12 Parent [hash] (Self ); // Call the callback function to notify the parent window proxy that it is ready
13 }
14 }
15 // This function is called by the parent window. An XMLHTTPRequest object is returned to the parent window, and the remaining operations are completed by the parent window.
16 Function Createhttprequest ()
17 {
18 If (Window. XMLHttpRequest)
19 {
20Return NewXMLHttpRequest ();
21}
22 Else   If ( Typeof (Activexobject) ! = " Undefined " )
23 {
24 Return   New Activexobject ( " Microsoft. XMLHTTP " );
25 }
26 }
27 </ Script >
28 </ Head >
29 < Body Onload = "OnLoad ()" > </ Body >
30 </ Html >

 

Code isn't complicated, it's a static file now I 've deployed to the http://51ditu.dituren.cn/51ditu/ajaxAgent.htm, and on my other subdomain pages if you need to call the services on the http://51ditu.dituren.cn/above, you can use code similar to the following:

 

1 Window. onagentloaded = Function (WIN) {Window. agentwindow=Win ;} // Set the callback function. When called back by the Agent Page, set the window. agentwindow variable.
2 Document. Domain = " Dituren.cn " ; // Set your own domain
3 Document. Write ( ' <IFRAME src = "http://51ditu.dituren.cn/51ditu/ajaxAgent.htm#K_CPoint_AgentLoaded" style = "display: none;"> </iframe> ' ); // Load the agent through Ajax on the page and provide the callback function name to the Agent Page through the anchor.
4
5 // Other programs on the page call this function to obtain the Ajax request object.
6 Function Createhttprequest ()
7 {
8 If (Window. agentwindow) {ReturnWindow. agentwindow. createhttprequest ();}
9 Else
10 {
11//What should I do if ajaxagent has not been loaded yet when the service is called?
12//My logic calls the local domain, because my service is deployed in each domain, and other domains (another server) need to be called only for performance)
13}
14 }

 

The above code has obtained an httprequest object. I don't need to explain how to use it here. In short, it is my pleasure to use this method to implement cross-subdomain name Ajax access.

I have always wanted to deploy my pages on a very stable server and deploy some additional services in another place, some of these additional services consume a lot of performance and avoid a big impact on the home page server. I can finally achieve this through this method.

This site from http://www.step1.cn/migration to http://www.dituren.cn/a very important thing is the domain name split, before a lot of content is deployed under a WWW domain name, now, I split it into many subdomain names. Later, I will mention the role of each domain name and related core technologies.