Suddenly feel that is the problem here, research, after the deal actually feel quite easy, but their knowledge or some deficiencies, the solution is as follows:
Blocked Ajax requests
Let's confirm the blocking of the request first. We use the following code:
Three consecutive requests launched
Copy Code code as follows:
function Simplerequest ()
{
var request = new XMLHttpRequest ();
Request.open ("POST", "script.ashx");
Request.send (NULL);
}
function threerequests ()
{
Simplerequest ();
Simplerequest ();
Simplerequest ();
}
3 consecutive requests for the same domain name are issued when the threerequests is executed, or the blocking effect is viewed through a statistical chart:
The last request was blocked by the top two requests
Each request takes 1.5 seconds to be spent. It is clear that the third request must wait until the end of the first request to execute, so that a total of more than 3 seconds is required for execution to complete. This is the situation that we want to change.
Traditional cross-domain asynchronous request solution
The only guarantee of Ajax security seems to be the restrictions on cross domain name (cross-domain) AJAX requests. An AJAX request to another domain name is prohibited unless you open a Web page on your local hard disk, or if you open the restrictions on the transfer of data across domain names in IE. And for the Cross-domain judgment is very strict, different subdomains, or the same domain name of different ports, will be recognized as different domain names, we can not make an AJAX request to their resources.
On the surface there seems to be no way to break this limit, but fortunately we have a savior, that is iframe!
Although IFrame does not appear in the standard, but because it is useful, Firefox also "had to" support it (similar to innerHTML). There are already some asynchronous requests made across the Internet, but they are not doing well. Their simple work is as follows: Place a specific paging file under another domain name as proxy, and the main page sends the information that is requested asynchronously via query string into the proxy page in the IFRAME, The proxy page puts the result in its own location hash after the AJAX request is executed, and the main page will poll the hash value of the src of the IFRAME, and if it finds a change, get the information needed through the hash value.
The implementation of this method is more complex and has limited function. In IE and Firefox, the length of the URL can support about 2000 characters. It may have been enough for ordinary needs, but it would be far from enough if a lot of data were to be delivered. Compared with the solution we are going to propose in a moment, perhaps its only advantage is the ability to make asynchronous requests across arbitrary domain names, and our solution can only break the limits of subdomains.
So now let's look at what we're doing!
Gracefully break the limits of subdomains
The key to breaking through the subdomain limit is the IFRAME.
IFrame is a good thing, we can cross the subdomain to access the page objects in the iframe, such as window and DOM structure, including invoking JavaScript (through Window objects)--we will Document.domain is set to be the same. Then in different subdomains of the page to launch a different request, the results through JavaScript to pass. The only thing that is needed is simply a static page as a proxy.
We are now ready to start writing a prototype, albeit simple, but it can explain the problem.
First, we'll write a static page, as a proxy placed in the IFRAME, as follows:
Subdomainproxy.html
Copy Code code as follows:
<title>untitled page</title>
<script type= "Text/javascript" language= "JavaScript" >
Document.domain = "test.com"; function SendRequest (method, URL)
{
var request = new XMLHttpRequest ();
Request.open (method, URL);
Request.send (NULL);
}
</script>
<body>
</body>
And then we'll write our homepage:
Http://www.test.com/Default.html
Copy Code code as follows:
<title>untitled page</title>
<script type= "Text/javascript" language= "JavaScript" >
Document.domain = "test.com"; function Simplerequest ()
{
var request = new XMLHttpRequest ();
Request.open ("POST", "script.ashx");
Request.send (NULL);
}
function Crosssubdomainrequest ()
{
var proxy = document.getElementById ("Iframeproxy"). Contentwindow;
Proxy.sendrequest (' POST ', ' http://sub0.test.com/Script.ashx ');
}
function threerequests ()
{
Simplerequest ();
Simplerequest ();
Crosssubdomainrequest ();
}
</script>
<body>
<input type= "button" value= "Request" onclick= "threerequests ()"/>
<iframe src= "http://sub0.test.com/SubDomainProxy.html" style= "Display:none;"
Id= "Iframeproxy" ></iframe>
</body>
When the Threerequests method is executed, the http://www.test.com and http://sub0.test.com resources under two different domain names will be requested at the same time. Obviously, the last request is not blocked by the first two requests:
Requests for different domain names will not be blocked
A satisfying result!
Although only to break through the subdomain, but this is enough, isn't it? Why do we want to be able to communicate between arbitrary domain names asynchronously? Not to mention how elegant our solution is! In the next article, we will implement a complete crosssubdomainrequestexecutor for the asp.net ajax client, which automatically determines whether a request to cross a subdomain is being made and how the AJAX request is chosen. In this way, the client's asynchronous communication layer is completely transparent to the developer. Is there anything more delightful than this? :)
Attention matters
Perhaps the following points are worth mentioning:
I also made some attempts after this idea, and finally found that creating the XMLHttpRequest object, calling the open method and the Send method must be performed in a page in the IFRAME to successfully send AJAX requests in IE and Firefox.
In the example above, the path we request to the subdomain is http://sub0.test.com/Script.ashx. Please note that the full sub domain name can not be omitted, otherwise there will be insufficient permissions under Firefox error, when calling the Open method will throw an exception-it seems that Firefox as a parent page domain name resources.
Because of the browser's security policy, browsers do not allow different domains (such as: Phinest.org and lab.phinest.org), different protocols (such as: Http://phinest.org and https://phinest.org), different ports (for example: The pages under http:phinest.org and http://phinest.org:8080 are accessed through XMLHttpRequest, which also affect the invocation and control of JavaScript on different pages, but when the primary domain, protocol, At the same time, by setting the Document.domain primary domain of the page, JavaScript can access control between different subdomains, such as by setting document.domain= ' phinest.org ', http:// Phinest.org and http://lab.phinest.org pages can be exchanged, and this feature also provides a solution for XMLHttpRequest to access each other under different subdomains in this case.
For Ajax Cross-domain problems when the primary domain, protocol, and Port are the same Very early has set document.domain to solve the argument, but has not seen the specific success of the application, this time to try, the principle is, the use of a hidden iframe to introduce the page across another subdomain as an agent, through JavaScript to control the introduction of another child domain of the IFRAME XMLHttpRequest for data acquisition. Ajax access under different primary/different protocols/different ports needs to be implemented through a broker in the background.
