php:例程javascript浏览器直到最后才出现

时间:2015-12-31 09:02:41

标签: javascript php google-chrome progress-bar

我们感觉在php中的程序在执行任务时显示了一个进程条,但在Chrome浏览器中,在进程结束之前不显示该条。在像Chromium这样的其他浏览器中,它可以很好地工作并显示进度条。有什么建议吗?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html lang="en">
<head>
    <title>Progress Bar</title>
</head>
<body>
<!-- Progress bar holder -->
<div id="progress" style="width:500px;border:1px solid #ccc;"></div>
<!-- Progress information -->
<div id="information" style="width"></div>
<?php
// Total processes
$total = 10;
// Loop through process
for($i=1; $i<=$total; $i++){
    // Calculate the percentation
    $percent = intval($i/$total * 100)."%";

    // Javascript for updating the progress bar and information
    echo '<script language="javascript">
    document.getElementById("progress").innerHTML="<div style=\"width:'.$percent.';background-color:#ddd;\">&nbsp;</div>";
    document.getElementById("information").innerHTML="'.$i.' row(s) processed.";
    </script>';


// This is for the buffer achieve the minimum size in order to flush data
    echo str_repeat(' ',1024*64);


// Send output to browser immediately
    flush();


// Sleep one second so we can see the delay
    sleep(1);
}
// Tell user that the process is completed
echo '<script language="javascript">document.getElementById("information").innerHTML="Process completed"</script>';
?>
</body>

1 个答案:

答案 0 :(得分:0)

我会成为那些讨厌你们为什么要做某事的人。

您确实需要将数据从服务器流式传输到浏览器吗?

除非您向用户发送大量生成的数据,否则实际上不需要这样的措施。

因为您没有使用WebSockets,所以您可以将有关该过程的信息保存到cookie中,这样您就不必将其存储在任何其他地方,并且它与单个客户端相关,并将AJAX请求发送到专用页面,它将返回百分比或此过程的状态。

当进程正在进行时,您只需要使用正确的值调用setcookie,例如

setcookie($name, $value, $expiration /*<--- does not matter*/);

并在返回此值

的专用页面中
return $_COOKIE[$name];      //<--- $name the same as in setcookie, 
                             //this should probably return JSON

并在js代码中(使用jquery,使其更容易)

$.get(page, function(data) 
    { 
        document.getElementById("progress").innerHTML = 
              '<div style="width: data;background-color:#ddd;"></div>';
    }

希望这有帮助。