Dies ist bei der Ausgabe von Text oder HTML recht einfach . Unten ist ein Beispiel.
(Sie werden jedoch auf Probleme stoßen, wenn Sie versuchen, JSON auszugeben , die ich weiter unten angehen werde.)
PHP-DATEI
header('Content-type: text/html; charset=utf-8');
function output($val)
{
echo $val;
flush();
ob_flush();
usleep(500000);
}
output('Begin... (counting to 10)');
for( $i = 0 ; $i < 10 ; $i++ )
{
output($i+1);
}
output('End...');
HTML-DATEI
<!DOCTYPE>
<html>
<head>
<title>Flushed ajax test</title>
<meta charset="UTF-8" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
</head>
<body>
<script type="text/javascript">
var last_response_len = false;
$.ajax('./flushed-ajax.php', {
xhrFields: {
onprogress: function(e)
{
var this_response, response = e.currentTarget.response;
if(last_response_len === false)
{
this_response = response;
last_response_len = response.length;
}
else
{
this_response = response.substring(last_response_len);
last_response_len = response.length;
}
console.log(this_response);
}
}
})
.done(function(data)
{
console.log('Complete response = ' + data);
})
.fail(function(data)
{
console.log('Error: ', data);
});
console.log('Request Sent');
</script>
</body>
</html>
Was ist, wenn ich dies mit JSON tun muss?
Es ist nicht möglich, ein einzelnes JSON-Objekt inkrementell zu laden (bevor es vollständig geladen ist), da die Syntax immer ungültig ist, bis Sie das vollständige Objekt haben.
Wenn Ihre Antwort jedoch mehrere JSON-Objekte nacheinander enthält, können Sie eines nach dem anderen laden, sobald sie die Pipe durchlaufen.
Also habe ich meinen Code oben um ...
Ändern von PHP FILE Zeile 4 von echo $val;nach echo '{"name":"'.$val.'"};'. Dies gibt eine Reihe von JSON-Objekten aus.
Ändern der HTML-DATEI-Zeile 24 von console.log(this_response);nach
this_response = JSON.parse(this_response);
console.log(this_response.name);
Beachten Sie, dass dieser rudimentäre Code davon ausgeht, dass jeder "Brocken", der in den Browser gelangt, ein gültiges JSON-Objekt ist. Dies ist nicht immer der Fall, da Sie nicht vorhersagen können, wie Pakete ankommen werden. Möglicherweise müssen Sie die Zeichenfolge anhand von Semikolons aufteilen (oder ein anderes Trennzeichen erstellen).
Nicht benutzen application/json
Do NOT Für Änderung Ihrer Header application/json- Ich tat dies , und es hatte mich für 3 Tage googeln. Wenn der Antworttyp lautet application/json, wartet der Browser, bis die Antwort vollständig ist. Die vollständige Antwort wird dann analysiert, um zu überprüfen, ob es sich um infaktes JSON handelt. Unsere vollständige Antwort lautet {...};{...};{...};jedoch NICHT JSON. Die jqXHR.doneMethode geht davon aus, dass ein Fehler aufgetreten ist, da die vollständige Antwort nicht als JSON analysiert werden kann.
Wie in den Kommentaren erwähnt, können Sie diese Prüfung auf der Clientseite deaktivieren, indem Sie Folgendes verwenden:
$.ajax(..., {dataType: "text"})
Hoffe, einige Leute finden das nützlich.