2017-03-19 7 views
0

時にはjQueryのドキュメントが私を投稿として気取らないように感じることがあります。jQueryのプログレスバーを使用して長時間実行されるPHPスクリプトの進捗状況を表示

私はサーバー上で複数の注文(数千を超える場合があります)の作成を処理するPHPを使用するアプリケーションを持っています。私はそのスクリプト($ .ajax経由で呼び出される)にUIの状態を通知する方法を理解しようとしています。

私は$ .ajaxの.onprogress、.success、および.complete要素を理解していますが、これらのイベントタイプのそれぞれにデータを供給するためにPHPスクリプトが実行する必要がある例は見つかりません。

古い学校のjavascriptでは、ajax.readyStateを使用して、スクリプトからPHP.echo()イベントを取得してから、PHP.exit()イベントを使用してリクエストを完了できます。

$ .ajaxの世界ではどうしますか?

新しいトリックを学ぼうとしている古い犬のおかげです。

答えて

0

ブルートフォースの方法でそれを考え出しました。

サーバー側からecho()するたびに、バンドルはonprogressハンドラにe.target.responseTextとして渡されます。結果はJSONであれば、あなたはthis_strをデコードする必要があります

var this_str, last_len = 0; 
... 
onprogress: function (e) { 
    this_str = e.target.responseText.substr(last_len); 
    ...do something with this_str... 
    last_len = e.target.responseText.length; 
} 
... 

(ではない:あなたはその前の長さを追跡するために、クライアント側の変数が必要になりますので、responseTextが各応答と一緒に成長し続けていることに注意してくださいresponseText)。これは、異なる手法で最も効果的です。なぜなら、パーズからの更新の頻度に応じて、オーバーロードが発生する可能性があるからです。あなたがjsonオブジェクトを送信しているので、responseText文字列全体は、クローズとカッコの中かっこで区切られた一連のjsonオブジェクトです。だから、の部分にそれを破ると、最新のを使用します。物事として、有用ではないonprogressイベントのカップルが存在することを

success: function (text) { 
    parts = text.split('}{'); 
    if (parts.length > 1) { 
     subtext = '{' + parts[parts.length - 1]; 
    } else { 
     subtext = parts[0]; 
    } 
    json = JSON.parse(subtext); 
    ... 

注:

var subtext, parts, json; 
... 
onprogress: function (e) { 
    parts = e.target.responseText.split('}{'); 
    if (parts.length > 1) { 
     subtext = '{' + parts[parts.length - 1]; 
    } else { 
     subtext = parts[0]; 
    } 
    json = JSON.parse(subtext); 
    ... 

成功機能は、JSONのために同様のアプローチを使用しています始める;それらをテストして無視してください。

サーバ側の関数が終了するかexit()すると、success関数とonprogress関数の両方で完全なresponseText文字列が返されます。成功したことで何か違うことをしたいのであれば、responseTextに最終的な文字列を記録しておいてください。

関連する問題