2

サーバーにtracertがあり、時間がかかる場合がありますが、データを表示したいとします。

私がこのようにすると：

 $.ajax({
         url: '/cgi-bin/trace.cgi',
         dataType: 'text',
         async: true,
         cache: false,
         success: function (response) {
           $('#traceOut').append(response);
         }
        });

cgi リクエストが完了したときにのみ呼び出されます。

XMLHttpRequest、onreadystatechange、および xmlhttp.readyState==3 を使用して直接実行できます。これは Firefox では正常に機能しますが、Chrome では 2k に達するとデータのみをダンプします。

jQueryでこれを行うにはどうすればよいですか?

4

1 に答える 1

0

ポーリングで可能です。注意が必要なのは、サーバー側で複数のユーザーのプロセスを調整することです。以下にワークフローを説明します。

メソッド

/**
 * Polls a URL until server indicates task is complete,
 * then sends a final request for those results.
 * 
 * Requires jQuery 1.4+.
 */
function poll(params) {

    // offer default params
    params = $.extend({
        error: function(xhr, status, err) {
            console.log('Network error: ' + status + ', ' + err);
        },
        progress: function(prog) {
            console.log(prog);
        },
        timeoutMillis: 600000,    // 10 minutes
        intervalMillis: 3000      // 3 seconds
    }, params);

    // kickoff
    _poll(params);

    function _poll(params) {
        $.ajax({
            url: params.url,
            type: 'GET',
            dataType: 'json',
            timeout: params.timeoutMillis,
            data: 'action=poll',
            success: (function(response, status, xhr) {
                if ('progress' in response) {
                    params.progress('Progress: ' + response.progress);
                }
                if ('status' in response) {
                    if (response.status == 'pending') {
                        // slight delay, then poll again
                        // (non-recursive!)
                        setTimeout((function() {
                            _poll(params);
                        }), params.intervalMillis);
                    }
                    else if (response.status == 'cancelled') {
                        params.progress("Task was cancelled");
                    }
                    else {
                        params.progress("Task complete");
                        // done polling; get the results
                        $.ajax({
                            url: params.url,
                            type: 'GET',
                            timeout: params.timeoutMillis,
                            data: 'action=results',
                            success: params.success,
                            error: params.error
                        });
                    }
                }
            }),
            error: params.error
        });
    }
}

使用例

poll({
    url: '/cgi-bin/trace.cgi',
    progress: function(prog) {
        $('body #progress').text(prog);
    },
    success: function(response, status, xhr) {
        $('body').html(response);
    }
});

ワークフロー

このメソッドは、パラメーター「action」を「poll」に設定してサーバーにリクエストを送信します。CGI スクリプトは、バックグラウンド タスクを起動し、ユーザー セッションでいくつかの状態を保持し、JSON 形式の文字列で応答する必要があります。

{"status": "pending", "progress": "0%"}

ブラウザーは、応答が完了を示すまで、これらの「action=poll」要求を繰り返し発行します。CGI スクリプトは、タスクの進行状況を追跡し、それに応じてブラウザーに応答する必要があります。これには、セッション処理と同時実行が含まれます。

{"status": "pending", "progress": "25%"}
{"status": "pending", "progress": "50%"}
{"status": "pending", "progress": "75%"}
{"status": "complete"}

次に、ブラウザは「action=results」リクエストを発行して、バックグラウンド タスクの最終的なペイロードを受け取ります。この例では、HTML のみです。

"<p>The answer is: 42</p>"
于 2012-09-05T07:25:03.327 に答える