ajax gotcha for new players

Being fairly new to the "Brave New World" of ajax, this week I fell into a fairly common trap that gets new players. I studiously looked around for the best practice implementation of making an http request using javascript and came up with the following javascript function which allows the user to make the http request, specify a callback function, and even goes the extra mile of implimenting timeouts (I guess the only other thing I really should do is implement an OnErrorCallback).

function MakeRequest(url, timeout, 
    onCompleteCallback, onTimeoutCallback)
{
    var completeCallback = onCompleteCallback;
    var timeoutCallback = onTimeoutCallback;        
         
    var xmlHttp=createXMLHttpRequest(); 
    
    if (xmlHttp)
    {          
        xmlHttp.onreadystatechange = function()
        {                
            if (xmlHttp.readyState == 4)
            {            
                window.clearTimeout(timeoutId);
                if (xmlHttp.status == 200 || 
                    xmlHttp.status == 304)
                {                
                    completeCallback(
                        xmlHttp.responseText);
                }
            }
        };
                                 
        xmlHttp.open("GET",url,true);
        
        var timeoutId = 
            window.setTimeout(function()
        {        
            if (callInProgress(xmlHttp))
            {
                xmlHttp.abort();
                timeoutCallback('timeout');
            }
        }         , timeout);
        
        xmlHttp.send(null);        
    }
}

function callInProgress(xmlHttp) 
{
    switch ( xmlHttp.readyState ) 
    {
        case 1, 2, 3:
        return true;
        break;

        // Case 4 and 0
        default:
        return false;
        break;
    }
}


function createXMLHttpRequest() {
  if(window.XMLHttpRequest) {
    try { 
      xmlHttpRequest = new XMLHttpRequest();
    } catch(e) { return null; }
  } else if(window.ActiveXObject) {
    try {
      xmlHttpRequest = 
        new ActiveXObject("Msxml2.XMLHTTP");
    } catch(e) {
      try {
        xmlHttpRequest = 
          new ActiveXObject("Microsoft.XMLHTTP");
      } catch (e) { return null; }
    }
  } else return null;
  return xmlHttpRequest;
}

I then wanted to call a .Net HttpHandler, and lets just say for arguments sake that the htp handler looks like this

public class Handler : IHttpHandler
{
    
    public void ProcessRequest (HttpContext context) 
    {
        System.Threading.Thread.Sleep(6000);
        context.Response.ContentType = "text/plain";
        context.Response.Write(Guid.NewGuid().ToString());
    }
 
    public bool IsReusable 
    {
        get 
        {
            return false;
        }
    }       
}

so the call from javascript would simply look something like this

        MakeRequest(
            'Handler.ashx?cookie=abcd&another=xyz', 
            20000, onRequestComplete, 
            onRequestTimeout);       
        
        function onRequestTimeout(response)
        {
            alert('timeout');
        }
        
        function onRequestComplete(response)
        {
            alert(response);
        }

The problem as I found out through good old wikipedia relates to the internet explorers caching of the "GET" http command as described in this article on HMLHttpRequest.
As discussed in the article, there are a number of ways around this, switch to using POST or ensure that you switch the caching off in the http headers. I chose the former.