jQuery AJAX結果またはJSONコンテンツに基づいたJSONレスポンスの処理AJAXポーリング

Question

私は初心者から中級のJavaScript/jQueryプログラマーですので、具体的な/実行可能な例が非常に高く評価されます。

マイプロジェクトDOMに追加されるコンテンツ、またはメッセージのいずれかを含むJSONを返すURLポーリングするAJAXを使用する必要が{「ステータス」を「保留」}バックエンドがまだ生成に取り組んでいることを示しますコンテンツのJSONレスポンスアイデアは、URLへの最初のリクエストでバックエンドがJSONレスポンス（キャッシュされます）の構築を開始し、その後のコールでこのJSONが準備ができているかどうかを確認します。 。私のスクリプトで

は、私は午前1時30分まで15秒間隔でこのURLをポーリングする必要があり、次の操作を行います

• エラーでAJAX要求の結果であれば、スクリプトを終了。
• AJAXリクエストが成功し、JSONコンテンツに{"status"： "pending"}が含まれている場合は、ポーリングを続けます。
• 成功でAJAXリクエストをもたらす場合、およびJSONコンテンツが利用可能なコンテンツ（{「ステータス」：「保留」}以外即ち有効な応答）が含まれ、その内容を表示し、ポーリングを停止し、スクリプトを終了します。

私はいくつかのアプローチを試してみましたが、成功は限られていましたが、彼らは必要以上に厄介な感覚を持っています。

// make the AJAX request 
function ajax_request() { 
    $.ajax({ 
    url: JSON_URL, // JSON_URL is a global variable 
    dataType: 'json', 
    error: function(xhr_data) { 
     // terminate the script 
    }, 
    success: function(xhr_data) { 
     if (xhr_data.status == 'pending') { 
     // continue polling 
     } else { 
     success(xhr_data); 
     } 
    }, 
    contentType: 'application/json' 
    }); 
} 

ただし、この機能は現在、それがない限り何もしません：ここで私は、私はJSONレスポンスから使用可能なコンテンツを取得する場合にその仕事をして一度に一つのAJAX要求を、作るために成功して使用しました骨格機能です使用可能なコンテンツを含む有効なJSON応答を受け取ります。

私はちょうどコメントである行に何をすべきかわかりません。私は別の関数がポーリングを処理する必要があり、必要に応じてajax _のrequest（）を呼び出すと思われますが、Ajaxの最も洗練された方法はわかりません_ request（）はその結果をポーリング関数に返信して応答できます適切に。

ご協力いただきありがとうございます。それ以上の情報を提供できるかどうか教えてください。ありがとう！

Answer 1

単純なタイムアウトを使用して、ajax_requestを再帰的に呼び出すことができます。

success: function(xhr_data) { 
    console.log(xhr_data); 
    if (xhr_data.status == 'pending') { 
    setTimeout(function() { ajax_request(); }, 15000); // wait 15 seconds than call ajax request again 
    } else { 
    success(xhr_data); 
    } 
} 

この行の周りにカウンタチェックを貼ると、最大の投票数が得られます。

if (xhr_data.status == 'pending') { 
    if (cnt < 6) { 
    cnt++; 
    setTimeout(function() { ajax_request(); }, 15000); // wait 15 seconds than call ajax request again 
    } 
} 

アラートを表示する場合を除き、エラー機能で何もする必要はありません。それがエラーであるという単純な事実は、成功関数が呼び出されず、別のポーリングを引き起こす可能性があります。私の頭の上オフ

Answer 2

：

$(function() 
{ 
    // reference cache to speed up the process of querying for the status element 
    var statusElement = $("#status"); 

    // this function will run each 1000 ms until stopped with clearInterval() 
    var i = setInterval(function() 
    { 
     $.ajax(
     { 
      success: function (json) 
      { 
       // progress from 1-100 
       statusElement.text(json.progress + "%"); 

       // when the worker process is done (reached 100%), stop execution 
       if (json.progress == 100) i.clearInterval(); 
      }, 

      error: function() 
      { 
       // on error, stop execution 
       i.clearInterval(); 
      } 
     }); 
    }, 1000); 
}); 

Answer 3

は、機能のためにどうもありがとうございました。これは少しバグですが、ここに修正があります。 100％に達した後には、clearInterval関数の使用方法が間違っているため、ロステロン酸の回答が止まらない。ここで

は仕事関数である：

$(function() 
{ 
    var statusElement = $("#status"); 

    // this function will run each 1000 ms until stopped with clearInterval() 
    var i = setInterval(function() 
    { 
     $.ajax(
     { 
      success: function (json) 
      { 
       // progress from 1-100 
       statusElement.text(json.progress + "%"); 

       // when the worker process is done (reached 100%), stop execution 
       if (json.progress == 100) clearInterval(i); 
      }, 

      error: function() 
      { 
       // on error, stop execution 
       clearInterval(i); 
      } 
     }); 
    }, 1000); 
}); 

てclearInterval（）関数は、パラメータとして間隔IDをbecommingされ、その後、すべてが大丈夫です;-)

乾杯 ニック

Answer 4

することができますjavascript setInterval関数を使用して、5秒ごとにコンテンツを読み込みます。あなたのreference-

Auto refresh div content every 3 sec