PHP + jQuery同步問題

Question

我在我的網站上使用jQuery + PHP，我想要做這樣的事情：
爲了簡化事情，我有一個帶有2個按鈕（）的頁面，根據這個頁面我點擊我要開始在後臺（PHP腳本）的腳本，所以我做了一個簡單的事情用jQuery：

$("#button1").click(function(){ 
    $.post("script.php", {val:"but1"}, function(result){ 
     alert(result); // I want something with the result 
    }); 
}); 

$("#button2").click(function(){ 
    $.post("script.php", {val:"but2"}, function(result){ 
     alert(result); 
    }); 
}); 

，並在script.php的if語句決定我應該做的，我有一個簡單的。
在php腳本中我正在下載一個文件，並且我想創建一個文件下載的進度條。 php腳本會在一段時間內返回我的值（echo percentage; flush();）。
問題出在這裏 - 當我回顯這些百分比值並刷新時，它會刷新它「只是在php中」，但jquery會一直等到腳本完成。有沒有辦法讓這些值出現（在刷新之後），還是有其他方法可以實現？我現在無法想到其他任何東西，也許我不應該使用jquery。
感謝您的幫助。

Answer 1

你可以在運行腳本時將進度存儲在文本文件或數據庫中，然後讓另一個文件通過AJAX調用獲取結果。

JS/HTML

<script> 
$(function() { 
    var id; 
    var timeoutLength = 1000; 

    $("#button1").click(function() { 
     $("#result").html(""); 

     // Create unique identifier 
     id = (new Date().getTime()) + "-" + Math.floor(Math.random()*100); 
     $.get("script.php", {id: id}, function(result){ 
      $("#result").html(result); 
     }); 

     setTimeout(checkProgress, timeoutLength); 
    }); 

    function checkProgress() { 
     $.get("script.php", {progress: true, id: id}, function(data) { 
      prog = parseInt(data); 
      // Display progress bar 
      if(prog < 100) { 
       $("#progress").css({ display: 'block', width: prog }); 
       $("#progress").html(prog + "%"); 

       setTimeout(checkProgress, timeoutLength); 
      } else { 
       $("#progress").css('display', 'none'); 
      } 
     }); 
    } 
}) 
</script> 
<button id="button1">Click</button> 
<div id="progress" style="background: green"></div> 
<div id="result"></div> 

腳本。PHP

<?php 

function getProgress($file) { 
    return (file_exists($file)) ? file_get_contents($file) : 0; 
} 

function setProgress($file, $progress) { 
    file_put_contents($file, $progress); 
} 

// Remove invalid characters 
$id = str_replace('/[^a-zA-Z0-9\-_]/', '', $_GET['id']); 
$file = "progress-" . $id . ".txt"; 

if(isset($_GET['progress'])) { 
    echo getProgress($file); 
} else { 
    // Do something and update progress 
    for($i = 10; $i <= 100; $i += 10) { 
     // Do something 

     setProgress($file, $i); 
     sleep(1); 
    } 
    unlink($file); 
    echo "Result: " . rand(1, 100); 
} 

編輯： 多個請求，簡單的進度條增加的支持。

Answer 2

只要你的PHP有一些方法來了解進度百分比，你應該對最新進展做多次請求：

function receiveProgress(data) { 
    // update progres indicator here 
    if (parseFloat(data) < 100) { 
     setTimeout(checkProgress, 100); 
    } else { 
     pressedButton = ''; 
    } 
} 

function checkProgress() { 
    $.post("script.php", {val:pressedButton}, receiveProgress); 
} 


var pressedButton = ''; 
$("#button1").click(function(){ 
    pressedButton = 'but1'; 
    checkProgress(); 
}); 

這種進步會問服務器更新每隔100ms

Answer 3

我相信，所有你需要的是pecl uploadprogress package

這是不是很容易安裝，它不知道它的工作原理，我發現很難使其在某些服務器配置下工作，但我認爲它是一個很好的拍攝

編輯：抱歉，我沒有看到你提到的下載，以便看看here

Answer 4

以下腳本將進度條的工作。

但是，我會做的是，觸發一個AJAX調用開始下載並觸發另一個AJAX調用來開始接收輸入（使用How to show file download progress in PHP Shell Scripting?）。

PHP：

<?php 
echo "wget '$feedURL'\n"; 
$execute = "wget -O ".$filePath." '$feedURL'\n"; 
$systemOutput = shell_exec($execute); 
$systemOutput = str_replace("\n", "\n\t", $systemOutput); 
echo "\t$systemOutput\n"; 
?> 

GetProgress：

function getProgress(){ 
    GDownloadUrl("getprogress.php?progress_key=<?php echo($unique_id)?>", 
       function(percent, responseCode) { 
        document.getElementById("progressinner").style.width = percent+"%"; 
        if (percent < 100){ 
         setTimeout("getProgress()", 100); 
        } 
       }); 

} 

這裏是很好的執行的幫助PHP的APC文件的上傳過程中得到一個不錯的進度條 - http://www.haughin.com/2007/10/23/php-upload-progress-with-php-52-apc/