XMLHttpRequest is used to find a faster server

Question

I have a situation where my site needs to quickly retrieve data from my server through AJAX.

My site runs on port 80, serving regular web pages. I usually run my AJAX server on port 8001 (I use JSONP, and this works fine). This works for most users. However, some users are blocked from high ports by local firewalls.

To block users who have outgoing connections on port 8001 to use my site, I want to return to port 80 if the user cannot get a response to port 8001.

The reason I don't use port 80 all the time is because sometimes people have smart antivirus gateways or other application-level firewalls that intercept outgoing connections on port 80. They add a couple of hundred milliseconds to my time in both ends. My AJAX service should minimize round-trip response time.

I use jQuery to make XMLHttpRequest easier to use. I use the JSONP option, and this part works - pulling AJAX requests from a different IP address or port is not a problem in itself.

The idea I have is that when the page loads first, it launches 2 getJSON calls. One on port 8001, and the other on port 80. The same response handler is used in both calls.

The first call to the response handler sets my variable "portToUse" and then works with normal functionality.

This works when port 8001 is not blocked. If port 8001 is blocked, this also works. However, a delay of 5 seconds before my reply from port 80 returns. This is not called by the server. I would like to eliminate this delay.

My theory is that although getJSON is asynchronous, the browser only runs one XMLHttpRequest at a time. He waits until the first one either returns or the time runs out before sending the next one.

I'm not sure if I'm right. If so, is there a way around this functionality and turn off both XMLHttpRequest at the same time? If I am mistaken, do you have a suggestion as to what might cause a delay in receiving my second response (from port 80 on my server)? Any other suggestions are welcome.

EDIT: This behavior is only observed in Firefox 3 and Opera 9.63. IE7 and Chrome do not show this delay.

Answer 1

AJAX call happens simultaneously.

I would set the global var portToUse = 80 (by default) and set up a function that calls on port 8001 to get a very small amount of data. If the ajax request successfully returns to 8001, change portToUse = 8001 ;

Requests that you start immediately will go to 80 until you find out that 8001 is open. Then it will switch, and all future requests will be made to 8001.

You can also do this:

 var request = $.ajax({ type: 'POST', url: 'test.html:8001', success: function(){ portToUse = 8001; } }); setTimeout(function(){ request.abort(); }, 1000); 

So, if the request takes more than a second, we will cancel the request together, and your requests continue to use port 80. You can set this timeout value to anything, depending on how long you want to allow the request to be tried. 500 will be 500 ms, etc.