저는 jQuery를 배우고 있으며 조건에 대해 API를 폴링하는 간단한 코드 예제를 찾으려고합니다. (즉, 몇 초마다 웹 페이지를 요청하고 결과를 처리합니다.)
jQuery에서 AJAX를 수행하는 방법에 대해 잘 알고 있습니다. “타이머”에서 실행하는 “적절한”방법을 찾지 못하는 것 같습니다.
답변
function doPoll(){
$.post('ajax/test.html', function(data) {
alert(data); // process results here
setTimeout(doPoll,5000);
});
}
답변
다음은 jQuery를 사용한 긴 폴링 (장기 유지 HTTP 요청) 에 대한 유용한 기사입니다 . 이 기사에서 파생 된 코드 조각 :
(function poll() {
setTimeout(function() {
$.ajax({
url: "/server/api/function",
type: "GET",
success: function(data) {
console.log("polling");
},
dataType: "json",
complete: poll,
timeout: 2000
})
}, 5000);
})();
이것은 ajax 요청이 완료된 후에 만 다음 요청을 만듭니다.
대기 / 시간 초과 간격을 적용하기 전에 처음 호출 될 때 즉시 실행되는 위의 변형입니다.
(function poll() {
$.ajax({
url: "/server/api/function",
type: "GET",
success: function(data) {
console.log("polling");
},
dataType: "json",
complete: setTimeout(function() {poll()}, 5000),
timeout: 2000
})
})();
답변
ES6에서
var co = require('co');
var $ = require('jQuery');
// because jquery doesn't support Promises/A+ spec
function ajax(opts) {
return new Promise(function(resolve, reject) {
$.extend(opts, {
success: resolve,
error: reject
});
$.ajax(opts);
}
}
var poll = function() {
co(function *() {
return yield ajax({
url: '/my-api',
type: 'json',
method: 'post'
});
}).then(function(response) {
console.log(response);
}).catch(function(err) {
console.log(err);
});
};
setInterval(poll, 5000);
- 재귀를 사용하지 않습니다 (함수 스택은 영향을받지 않음).
- setTimeout-recursion이 tail-call 최적화가 필요한 곳에서 어려움을 겪지 않습니다.
답변
function poll(){
$("ajax.php", function(data){
//do stuff
});
}
setInterval(function(){ poll(); }, 5000);
답변
function make_call()
{
// do the request
setTimeout(function(){
make_call();
}, 5000);
}
$(document).ready(function() {
make_call();
});
답변
jQuery.Deferred () 는 비동기 시퀀싱 및 오류 처리 관리를 단순화 할 수 있습니다.
polling_active = true // set false to interrupt polling
function initiate_polling()
{
$.Deferred().resolve() // optional boilerplate providing the initial 'then()'
.then( () => $.Deferred( d=>setTimeout(()=>d.resolve(),5000) ) ) // sleep
.then( () => $.get('/my-api') ) // initiate AJAX
.then( response =>
{
if ( JSON.parse(response).my_result == my_target ) polling_active = false
if ( ...unhappy... ) return $.Deferred().reject("unhappy") // abort
if ( polling_active ) initiate_polling() // iterative recursion
})
.fail( r => { polling_active=false, alert('failed: '+r) } ) // report errors
}
이것은 우아한 접근 방식이지만 몇 가지 문제가 있습니다 …
- a
then()
가 즉시 넘어 가지 않도록 하려면 콜백이 다른 thenable 객체 (아마도 anotherDeferred
)를 반환해야합니다.이 객체 는 sleep 및 ajax 라인이 모두 수행합니다. - 다른 사람들은 인정하기에는 너무 창피합니다. 🙂
답변
(function poll() {
setTimeout(function() {
//
var search = {}
search["ssn"] = "831-33-6049";
search["first"] = "Harve";
search["last"] = "Veum";
search["gender"] = "M";
search["street"] = "5017 Ottis Tunnel Apt. 176";
search["city"] = "Shamrock";
search["state"] = "OK";
search["zip"] = "74068";
search["lat"] = "35.9124";
search["long"] = "-96.578";
search["city_pop"] = "111";
search["job"] = "Higher education careers adviser";
search["dob"] = "1995-08-14";
search["acct_num"] = "11220423";
search["profile"] = "millenials.json";
search["transnum"] = "9999999";
search["transdate"] = $("#datepicker").val();
search["category"] = $("#category").val();
search["amt"] = $("#amt").val();
search["row_key"] = "831-33-6049_9999999";
$.ajax({
type : "POST",
headers : {
contentType : "application/json"
},
contentType : "application/json",
url : "/stream_more",
data : JSON.stringify(search),
dataType : 'json',
complete : poll,
cache : false,
timeout : 600000,
success : function(data) {
//
//alert('jax')
console.log("SUCCESS : ", data);
//$("#btn-search").prop("disabled", false);
// $('#feedback').html("");
for (var i = 0; i < data.length; i++) {
//
$('#feedback').prepend(
'<tr><td>' + data[i].ssn + '</td><td>'
+ data[i].transdate + '</td><td>'
+ data[i].category + '</td><td>'
+ data[i].amt + '</td><td>'
+ data[i].purch_prob + '</td><td>'
+ data[i].offer + '</td></tr>').html();
}
},
error : function(e) {
//alert("error" + e);
var json = "<h4>Ajax Response</h4><pre>" + e.responseText
+ "</pre>";
$('#feedback').html(json);
console.log("ERROR : ", e);
$("#btn-search").prop("disabled", false);
}
});
}, 3000);
})();