I'm trying to output echo statements in my PHP script which when launched normally via browser works fine. But when the PHP page is loaded via jQuery .load() method, the output is always buffered irrespective of whatever I do.
PHP (test.php)
header('Content-type: text/html; charset=utf-8');
header('Surrogate-Control: BigPipe/1.0');
header("Cache-Control: no-cache, must-revalidate");
header('X-Accel-Buffering: no');
ob_end_flush();
ob_implicit_flush();
echo "First line<br>";
sleep(5);
echo "Second line<br>";
So, when I launch test.php in my browser, I get the first line followed by the second line after 5 seconds (as expected). However, when I load this script into another HTML in a <div> tag, both the echo statements output at the same time i.e. after 5 seconds. Browser Chrome 64.0.3282.186.
HTML:
<div id="testDiv"></div>
JS:
<script>
$("#testDiv").load("test.php");
</script>
jqueryis the one causing this - by waiting for the complete result. But what do you think should happen instead? Do you expect the first call ofload()to show the first line and the second call - after a while - to show both lines? ... or what exactly do you expect?echoprints the first line of text in the<div>in which it is loaded, and then after 5 seconds delay print the second line of text. Yes, jQuery'sload()method somehow is waiting for the entire output to be received to flush the output into the<div>in which the PHP script is loaded. Any idea how to tell jQuery load() method to display the content as and when received instead of buffering it?