php、ajax、またはjavascriptで進行状況がロードされていますか？

Question

システムがまだサーバー側でデータを取得している間に、クライアント側で完了した％でロードの進捗状況を表示する方法を知っている人はいますか？

たとえば、クライアント側で「OK」ボタンを押すと、データベースからデータを収集するためにサーバー側にコールされます。プロセス全体が2〜3分かかります。どのようにクライアント側でロードの進捗状況を表示することができますか（lodingの何％が完了したか）

どうすればphp、ajax、またはjavascriptで行うことができますか？

Answer 1

あなたが「OK」ボタンをクリックしたら、データ・サーバ側のフェッチを開始し、セッションにロードされた割合を保つことができます。

このようにして、クライアント側では、AJAX経由で別のPHPスクリプトにリクエストして、ロードされた割合を返すことができます。

2つのサーバーサイドスクリプト（1つはデータをフェッチし、もう1つはパーセンテージをフェッチする）と1つのAJAX要求クライアント側で終了します。

私はこれは簡単な解決策だと思います。

Answer 2

私は結果をページングすることでこれを行います。

最初のリクエストはカウントを取得することです。その後、リクエストを複数のグループに分割します。 その後、一度に1つずつグループの要求を開始します。例えば

：返すために100件のレコードがある場合、私は10 のグループにそれらを破るそれから私は簡単に... 20％、10％を表示することができます...など

私は知りませんとにかくこれをする。

Answer 3

jQueryは、ajaxリクエストの実行中にスプラッシュ画面（div）を表示できます。これは、.ajaxStartおよび.ajaxEnd（または.ajaxStop）を使用してリクエストごとに行うことも、複雑な方法はDojoのdojo.io.bindを使用する方法と、以下のPeriodic Refresh Patternに従う方法です。

Periodic Refresh

Answer 4

それは簡単ではありません。 ajax呼び出しが処理を開始すると、チャンク/マルチパート応答を行うことができます（ほとんどのdhtmlチャットが実装されている方法です）。 "COMET"のgoogle

基本的にはそのように動作します：

1. クライアント：AJAXコール実行時間の長いアクションの開始を要求
2. サーバー：（スクリプトの終了なし）、実行時間の長いアクションを開始echo 0％、flush();
3. クライアント：フラッシュされたコンテンツ（特別なコールバック）で応答を受信し、値を表示しますが、接続は開いたままです！
4. サーバー：Xアクションの後echoとflush();
5. クライアント、割合を計算：第3位
6. サーバーを参照してください。スクリプトの終わりのための通常のイベント/コールバック：スクリプトが完了した場合、
7. クライアントを終了します。（まだ新しかったJavaScriptの非同期は！と）少しデモをコード化されたディスプレイが100％、開いて次のページ

私一度...それは故人となったビットは今ですが、非同期部分がまだ動作します。あなたはここでそれを見つけることができます：

<?php 

    $c = $_GET[ 'c' ]; 

     header('Content-type: multipart/x-mixed-replace;boundary="rn9012"'); 

     sleep(1); 

     print "--rn9012\n"; 
     print "Content-type: application/xml\n\n"; 
     print "<?xml version='1.0'?>\n"; 
     print "<content>Multipart: First Part of Request " . $c . "</content>\n"; 
     print "--rn9012\n"; 
     flush(); 

     sleep(3); 

     print "Content-type: application/xml\n\n"; 
     print "<?xml version='1.0'?>\n"; 
     print "<content>Multipart: Second Part of Request " . $c . "</content>\n"; 
     print "--rn9012--\n"; 
?> 

ことが可能方向にナッジよりも何もない：http://wehrlos.strain.at/httpreq/client.html

はjavascriptのクライアント側のコードは、

function asSendSyncMulti() { 
    var httpReq = new XMLHttpRequest(); 

    showMessage('Sending Sync Multipart ' + (++this.reqCount) ); 

    // Sync - wait until data arrives 
    httpReq.multipart = true;  
    httpReq.open('GET', 'server.php?multipart=true&c=' + (this.reqCount), false); 
    httpReq.onload = showReq; 
    httpReq.send(null); 
} 

function showReq(event) { 
    if (event.target.readyState == 4) { 
     showMessage('Data arrives: ' + event.target.responseText); 
    } 
    else { 
     alert('an error occured: ' + event.target.readyState); 
    } 
} 

マルチパートのためのサーバーサイドPHPコードを使用しました。 HTMLに準拠していないか、クロスブラウザーではありません。 xmlの代わりにjsonを使用します。

サーバー側では、出力キャッシュ（圧縮など）をオフにする必要があります。そうしないと、flush();は何も行いません。 --rn9012は、出力されたデータに決して出現しないものでなければなりません（進行状況を表示してもまだ表示されていない場合はunlikley）。

Answer 5

multipart/x-mixed-replace;フラッシュは、ステートレスロードバランス環境で動作する必要があります。 定期的なGETリクエストに依存して進行状況をチェックする方法は、後続のリクエストが異なるバックエンドに向かう環境では成功しません。

Answer 6

私は同じことを行う必要 - Ajaxのデータのダウンロードの進行状況を追跡する - ので、私は誰かがこのスレッドにバンプの場合には、私が使用した溶液投稿します：

var req = new XMLHttpRequest(); 

req.addEventListener("progress", onUpdateProgress, false); 
req.addEventListener("load", onTransferComplete, false); 
req.addEventListener("error", onTransferFailed, false); 
req.addEventListener("abort", onTransferAborted, false); 

req.open("GET", ..., true); 

... 

req.send() 

function onUpdateProgress(e) { 
    if (e.lengthComputable) { 
    var percent_complete = e.loaded/e.total; 
    document.getElementById("progressMessage").value = Math.round(percentComplete*100) +"% [ " + Math.round(e.loaded/1000) + " KB ]"; 
    ... 
    } else { 
    // Length not known, to avoid division by zero 
    } 
} 

function onTransferComplete(e) { ... } 

function onTransferFailed(e) { ... } 

function onTransferAborted(e) { ... } 

を