Implementierung der AJAX-Anforderungswarteschlange

In diesem Artikel wird hauptsächlich der Implementierungscode der AJAX-Anforderungswarteschlange vorgestellt, der einen gewissen Referenzwert hat.

AJAX wird bei der Verwendung auf ein Problem stoßen Wenn der Benutzer in kurzer Zeit mehrere asynchrone Anforderungen ausführt und die vorherige Anforderung nicht abgeschlossen wird, hat dies in den meisten Fällen keine Auswirkungen, z. B. das Anfordern einer neuen Liste Keine Notwendigkeit für alte Anfragen. Es treten jedoch Probleme auf, wenn unser WEB-Programm mehrere Anfragen gleichzeitig aufrufen muss oder wenn der Benutzer verschiedene Arten von Daten anfordert, die alle ausgeführt werden müssen Führen Sie sie der Reihe nach aus.

Verschiedene Browser erlauben die gleichzeitige Ausführung verschiedener Threads. Wenn mehr als zwei asynchrone Anforderungen gleichzeitig ausgeführt werden, werden daher nur die letzten beiden ausgeführt.

Die AJAX-Warteschlange ist sehr einfach. Erstellen Sie ein Array zum Speichern der Anforderungswarteschlange. Jedes Element im Array ist ein Array von Anforderungsparametern, anstatt AJAX direkt auszuführen Zuerst als Array als Elemente verwenden und dann in der Warteschlange speichern und prüfen, ob mehrere Anforderungen in der Warteschlange vorhanden sind. Wenn nicht, führen Sie das einzige Element in der aktuellen Warteschlange aus Andere Elemente bedeuten, dass die Warteschlange noch ausgeführt wird. Machen Sie sich also keine Sorgen, andere Elemente. Nach Abschluss der Ausführung ist dieses Element an der Reihe. Nach Abschluss der AJAX-Ausführung wird das aktuell ausgeführte Warteschlangenelement ausgeführt gelöscht, und dann wird das Array überprüft, um zu sehen, ob es irgendwelche Anfragen gibt. Wenn ja, wird die Ausführung fortgesetzt, bis alle Anfragen abgeschlossen sind. Das Folgende ist eine Warteschlange, die ich zuvor erstellt habe.

//Ajax Function
var reqObj; //Creat Null Instence
var RequestArray = new Array();
//var whichRequest;
//加入请求队列
function AddRequestArray(url,isAsy,method,parStr,callBackFun)
{
    var ArgItem = new Array();
    ArgItem[0]=url;
    ArgItem[1]=isAsy;
    ArgItem[2]=method;
    ArgItem[3]=parStr;
    ArgItem[4]=callBackFun;
    RequestArray.push(ArgItem);   //将当前请求添加到队列末尾
    if(RequestArray.length==1) //如果请求队列里只有当前请求立即要求执行队列，如果有其他请求，那么就不要求执行队列
    {
      ExeRequestArray();
    }
}

//执行队列里的顺序第一个的请求
function ExeRequestArray()
{
  if( RequestArray.length>0) //如果队列里有请求执行 AJAX请求
  {
    var ArgItem = RequestArray[0];  DoRequest(ArgItem[0],ArgItem[1],ArgItem[2],ArgItem[3],ArgItem[4]);
  }
}
//Run Ajax (string urladdress,bool IsAsy,string method,string parameters,string whichRequest)
function DoRequest(url,isAsy,method,parStr,callBackFun) 
{
  reqObj = false;
  //whichRequest = whichReq;
  if (window.XMLHttpRequest) //compatible Mozilla, Safari,...
  {
    reqObj = new XMLHttpRequest();       //Creat XMLHttpRequest Instance
    if (reqObj.overrideMimeType)        //if Mime Type is false ,then set MimeType 'text/xml'
    {
      reqObj.overrideMimeType('text/xml');
    }
  }
  else if (window.ActiveXObject) //compatible IE
  {
    try
    {
      reqObj = new ActiveXObject("Msxml2.XMLHTTP"); //Creat XMLHttpRequest Instance
    }
    catch (e)
    {
      try
      {
        reqObj = new ActiveXObject("Microsoft.XMLHTTP"); //Creat XMLHttpRequest Instance
      }
      catch (e)
      {}
    }
  }

  //if reqObj is false,then alert warnning
  if (!reqObj)
  {
    alert('Giving up :( Cannot create an XMLHTTP instance');
    return false;

  }
  reqObj.onreadystatechange = function(){GetRequest(callBackFun)}; //set onreadystatechange Function
  reqObj.open(method, url, isAsy);    //set open Function
  reqObj.setRequestHeader('Content-Type','application/x-www-form-urlencoded'); //set RequestHeader
  reqObj.send(parStr);  //do send and send parameters 
}

//get Service Response information Function
function GetRequest(callBackFun)
{
  //judge readystate information
  if (reqObj.readyState == 4)
  {
    //judge status information
    if (reqObj.status == 200)
    {
      eval(callBackFun+"(reqObj)");
    }
    else
    {
      alert('There was a problem with the request.'+reqObj.status+"CallFunction:"+callBackFun); //else alert warnning
    }
    RequestArray.shift(); //移除队列里的顺序第一个的请求，即当前已经执行完成的请求
    ExeRequestArray();   //要求执行队列中的请求
  }
}

Das oben Gesagte habe ich für Sie zusammengestellt. Ich hoffe, es wird Ihnen in Zukunft hilfreich sein.

Verwandte Artikel:

Eine Zusammenfassung verschiedener Methoden zur Verwendung von Ajax zum asynchronen Senden von Formularen

Lösen von AJAX-Anfragen, die enthalten Arrays-Methode

Ajax-Anfrage und Filterkooperationsfallanalyse

Das obige ist der detaillierte Inhalt vonImplementierung der AJAX-Anforderungswarteschlange. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!