JavaScript Ajax Request Queue Frage

asseskiller

Lt. Junior Grade
Registriert
Sep. 2005
Beiträge
447
Hallo ich habe mir im Internet folgenden Code gesucht und ihn leicht Modifiziert

HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Unbenanntes Dokument</title>
</head>

<body>
<script type="text/javascript" language="javascript">

/************************************
AJAX Request Queue
url - ajaxcall 
container - div to fill with innerHTML
************************************/

var queue = new Array();
var httpRequestObjectBusy = false;
var httpRequestObject = gethttpRequestObject();
i=0;

function aQueue(url,container) 
{
	//alert(i);
	if(httpRequestObjectBusy==true) 
	{     
		queue.push(new Array(url,container));
	}
	else
	{
		httpRequestObjectBusy=true;
		httpRequestObject.open('GET',url,true); 		
		httpRequestObject.send(null);	
		httpRequestObject.onreadystatechange = function()
		{
			if( httpRequestObject.readyState == 4 )
			{
				httpRequestObjectBusy=false;			
				var text = httpRequestObject.responseText;
				document.getElementById(container).innerHTML = httpRequestObject.responseText;
				if(queue.length!= 0) 
				{
					var element1 = queue[0][0];
					var element2 = queue[0][1];
					queue.shift();
					i++;
					aQueue(element1, element2);  
				}
			}
		};       
	} 
}


function gethttpRequestObject() {
	if (window.XMLHttpRequest) {
		return new XMLHttpRequest(); //Not IE
	} else if(window.ActiveXObject) {
		return new ActiveXObject("Microsoft.XMLHTTP"); //IE
	} else {
		alert("Your browser doesn't support the XmlHttpRequest object.<br>Better upgrade to Firefox.");
	}
}
	
</script>


<div onclick="aQueue('test_2.php?param=a','test1'); aQueue('test_2.php?param=b','test2'); aQueue('test_2.php?param=c','test3'); aQueue('test_2.php?param=d','test4');"><a href="#">3 Anfragen "gleichzeitig" ausf&uuml;hren</a></div>

<div id='test1'></div>
<div id='test2'></div>
<div id='test3'></div>
<div id='test4'></div>
</body>
</html>

Das hier ist die test_2.php

PHP:
<?php

if($_GET['param'] == 'a')
{echo '1<br>';}
if($_GET['param'] == 'b')
{echo '2<br>';}
if($_GET['param'] == 'c')
{echo '3<br>';}
if($_GET['param'] == 'd')
{echo '4<br>';}
if($_GET['param'] == 'e')
{echo '5<br>';}

?>
Mein Problem ist das die Abfragequeue scheinbar in Firefox nicht funktionier. In Google Chrome funktioniert alles Prima. Aber im FF führt er nur 2 Abfragen aus und in Firebug sehe ich folgendes Bild hier klicken

Ist die Queue irgendwie falsch?

Danke für die Antwort im Vorraus
 

Anhänge

  • Bildschirmfoto 2010-08-17 um 10.51.38.png
    Bildschirmfoto 2010-08-17 um 10.51.38.png
    36,9 KB · Aufrufe: 315
Bei mir laufen alle 4 in Firefox. Allerdings verwende ich eine primitive lokale HTML Datei.
Code:
<div onclick="aQueue('content.html','test1'); aQueue('content.html','test2'); aQueue('content.html','test3'); aQueue('content.html','test4');"><a href="#">3 Anfragen "gleichzeitig" ausf&uuml;hren</a></div>

Es funktioniert ebenso wenn ich verschiedene HTML Dateien verwende um das Timing zwischen den Aufrufen zu ändern da sonst aus dem Cache gelesen wird.
Code:
<div onclick="aQueue('content1.html','test1'); aQueue('content2.html','test2'); aQueue('content3.html','test3'); aQueue('content4.html','test4');"><a href="#">3 Anfragen "gleichzeitig" ausf&uuml;hren</a></div>

Ebenso wenn ich das ganze über einen kleinen Webserver ausliefern lasse um es weiter zu verzögern.

Ich habe keine Erfahrung mit Firebug, aber anhand der Fortschrittsanzeige sieht es aus als würden zwei Anfragen gleichzeitig laufen, oder?

Ich weiß zwar nicht konkret wie es bei dem Code dazu kommen könnte, solange man nicht mehrfach klickt, aber in jedem Fall gibt es eine mögliche Fehlerquelle.

Code:
httpRequestObjectBusy=false;			
var text = httpRequestObject.responseText;
document.getElementById(container).innerHTML = httpRequestObject.responseText;

httpRequestObjectBusy soll ja offenbar verhindern, dass mehrfach auf das httpRequestObject zugegriffen wird. Hier wird es allerdings freigegeben, und dann doch noch darauf zugegriffen, sodass beim nächsten Aufruf von aQueue das httpRequestObject verändert werden könnte noch bevor der responseText abgefragt wurde.

Gedacht war das ganze wohl eher so:


Code:
var text = httpRequestObject.responseText;
httpRequestObjectBusy=false;			
document.getElementById(container).innerHTML = text ;
 
Zuletzt bearbeitet:
funktioniert es bei dir wenn du die test_2.php so belässt?
 
kannst du das hier mal testen. Will wissen ob es an meinem Browser liegt.

Habe es zwischenzeitlich mal mit deiner Variante versucht, aber es kam der gleich fehler wie immer
 
asseskiller schrieb:
kannst du das hier mal testen. Will wissen ob es an meinem Browser liegt.

Funktioniert in Firefox 3.6.8, IE 8 und Chrome 4.0.249.78 bei mir.


Du hast allerdings die DIVs gerade nicht sauber geschlossen:
<div onclick="aQueue('test_2.php?param=a','test1'); aQueue('test_2.php?param=b','test2'); aQueue('test_2.php?param=c','test3'); aQueue('test_2.php?param=d','test4');"><a href="#">4 Anfragen "gleichzeitig" ausf&uuml;hren mit PHP Datei</a></</div>
 
Ich bin mir gar nicht sicher, ob man das XmlHttpRequest-Objekt mehrmals verwenden darf, da bei mir auch nur der erste Request endet und die beiden danach nicht (Limitierung auf 2 offene Verbindungen pro Host) würde ich mal stark vermuten, dass dies nicht erlaubt ist.

ändere den Code doch mal folgendermaßen:
HTML:
httpRequestObjectBusy=true;
httpRequestObject=gethttpRequestObject();
httpRequestObject.open('GET',url,true);

ich erinnere mich zumindest gerade daran, dass es mit dem IE (6?) Probleme gab, das Objekt mehrmals zu nutzen.
 
Zuletzt bearbeitet:
Zurück
Oben