Javascript XMLHttpRequest issue
<p>I am using the following script to monitor whether I can connect to a web site in a regular interval (10 seconds in my sample code). I met with two issues, any ideas how to solve them?</p>

<ol>
<li><p>If a web site is very slow and no response within 10 seconds (making PingWebSite not return), I find 2 second call to PingWebSite will be executed because of 10 second interval arrives. My purpose is I want only one call to PingWebSite is under execution, and if 10 seconds interval arrives and previous PingWebSite is executing, I want to prevent current PingWebSite from execution. Any ideas how to solve this?</p></li>
<li><p>I find a strange issue, when I connect to a very slow web site, and code path executes to "alert("connecting");", then I expect exception to be thrown for timeout, but in my debug, no exception is thrown. Any ideas how to catch timeout exception?</p></li>
</ol>

<p>Here is my code,</p>

<pre><code>var index = 0;

function setup() {
    window.setInterval(PingWebSite, (10 * 1000));
}

function PingWebSite() {

    var http_request = new XMLHttpRequest();
    try {
        http_request.open("GET", "http://www.google.com", true);
        http_request.onreadystatechange = function() {
            if (http_request.readyState == 4) {
                if (http_request.status == 200) {
                    MonitorInformation.innerText = "http://www.google.com" + " Connection ok";
                    alert("ok");
                }
                else {
                    alert("fail");
                }
                http_request = null;
            } // if if (http_request.readyState == 4)
            else {
                // if execute here, no exception will be thrown
                alert("connecting");
            }
        }  // end of function
        http_request.send(null);
    } // try
    catch (e) {
        alert("service is not available");
    }
}
</code></pre>

<p>EDIT 1: I have followed advice here to modify my code. Here is the below version. The new issue is index value (e.g. 0) will be prompted in alert message box before ok/fail alert message box. I think index value (e.g. 0) should be prompted in alert message box after ok/fail alert message box. Any ideas why?</p>

<pre><code>var index = 0;
var http_request;
var xhrTimeout;
var chkConn;

function setup() {
    chkConn = window.setInterval(PingWebSite, (10 * 1000));
}

function WebMonitorTimeout() {
    http_request.abort();
    alert("timeout");
    index = index + 1;
}

function PingWebSite() {

    http_request = new XMLHttpRequest();
    http_request.open("GET", "http://www.google.com", true);

    http_request.onreadystatechange = function()
    {
        if (http_request.readyState == 4) {
            if (chkConn) { clearInterval(chkConn); }
            if (http_request.status == 200) {
                alert("ok");
                index = index + 1;
                if (xhrTimeout) { clearTimeout(xhrTimeout); }
            }
            else {
                alert("fail");
                index = index + 1;
                if (xhrTimeout) { clearTimeout(xhrTimeout); }
                }

                http_request = null;
            } //if (http_request.readyState == 4)

    }    // end of event function
    http_request.send(null);
    xhrTimeout = setTimeout("WebMonitorTimeout();", 30000);
    alert(index);
    chkConn = window.setInterval(PingWebSite, (30 * 1000));
}
</code></pre>

<p>thanks in advance,
George</p>
