为长时间运行的PHP进程集成jqueryUI进度条


Incorporating jquery UI progress bar for long running PHP process

我正在开发一个聊天日志管理器,我想对Thunderbird的聊天日志档案有更多的控制权。有一个同步功能,基本上可以解析日志文件并将消息上传到数据库,压缩日志并将其存储在归档文件夹中。

这个过程需要很长时间才能运行,我想显示一个进度条。我同时使用jQueryUI和Bootstrap,所以使用这两种方法的解决方案都是可以接受的。

到目前为止,我已经尝试过实现这两种方法,但都没有成功。进度条没有显示,我也无法判断它是否正在增加。

我已经粘贴了到目前为止的代码。任何帮助都将不胜感激。。。我对CSS有基本的了解,而我对javascript的了解充其量是有限的。

HTML头

<script>
    function UpdatePBar(x){
        $( "#progressbar" ).progressbar( "value", x );}
</script>

HTML正文

<div id="progressbar"></div>

同步处理PHP

if(count($this->Contacts) > 0)
        {
            //GET CONTACTS ALIASES
            $result = $this->GetContacts_aliases($folderPath);
            if($result) {
                echo '<script>UpdatePBar(10)</script>';
                flush();
                //SYNCH CONTACTS
                $result = $this->synch_Contacts();
                echo '<script>UpdatePBar(20)</script>';
                flush();
                if ($result) {
                    //SYNCH MESSAGES
                    $result = $this->synch_Messages($folderPath);
                    echo '<script>UpdatePBar(50)</script>';
                    flush();
                    if ($result) {
                        //SYNCHING SUCCESSFULLY COMPLETED
                        $log = "Synching of Messages Complete without errors. <br><br>";
                        $this->log = $this->log . $log;
                        //UPDATE LAST SYNCHED
                        $result = $this->UpdateLastSynched();
                        echo '<script>UpdatePBar(70)</script>';
                        flush();
                        if (!$result) {
                            //Update lastSynched failed
                            $log = "Updating lastSynched failed! <br><br>";
                            $this->log .= $log;
                        } else {
                            $log = "Updated Last Synched date stamp without errors <br><br>";
                            $this->log .= $log;
                            //ARCHIVE LOGS
                            $result = $this->ArchiveLogs($folderPath);
                            echo '<script>UpdatePBar(100)</script>';
                            flush();
                            if ($result) {
                                $log = "Archiving of log files successful!<br><br>";
                                $this->log .= $log;
                            } else {
                                $log = "Archiving of log files unsuccessful.<br><br>";
                                $this->log .= $log;
                            }
                        }
                    } else { 
...

感谢您抽出时间

我认为您应该通过递归ajax调用来实现这一点。

在php上创建一个返回百分比的文件;

Example: getPercentage.php 
<?
//do your stuff
echo $PERCENTAGE;
?>
Then on jquery:
<script>
readPHP();
function readPHP () {
   var file="getPercentage.php";
    $.ajax({
        url: file,
        cache: false,
        success: function (data , status ) {
         percentage=data;
         if (percentage < 100)
         {
           $("#progressbar").progressbar({
               value:percentage
           })
           setTimeout(readPHP(),1000);
         }
         else
         {
           $("#progressbar").progressbar({
               value:percentage
           })
         }
        }
   })
}
</script>