여러 Ajax 요청을 관리하는 올바른 방법은 무엇입니까?

Question

일부 데이터가 전송되는 AJAX 튜토리얼에서 몇 가지 예를 살펴 보았습니다. 그들은 모두 (다소) 다음과 같이 보입니다 :

var http = createRequestObject(); // shared between printResult() and doAjax() 

function createRequestObject() { /* if FF/Safari/Chrome/IE ... */ ... } 

function printResult() 
{ 
    if (http.readyState == 4) { ... } 
} 

function doAjax() { 
    var request = 'SomeURL'; 
    http.open('post', request); 
    http.onreadystatechange = printResult; 
    data = ...; // fill in the data 
    http.send(data); 
} 

// trigger doAjax() from HTML code, by pressing some button 

다음은 완전히 이해할 수없는 시나리오입니다. 버튼을 여러 번 아주 빠르게 누르면 어떻게 될까요? 해야 doAjax() 어떻게 든 http 개체를 다시 초기화합니까? 그리고 객체가 다시 초기화되면, 이미 방송중인 요청은 어떻게됩니까?

추신 : 추기 :이 질문은 아마도 더 많은 커뮤니티 - 위키와 관련이 있습니다. 여기에 명시된 바와 같이 (https://meta.stackexchange.com/questions/67581/community-wiki-checkbox-missing-in-action) - 제가 맞으면이 질문을 적절하게 표시하십시오.

Answer 1

현재 요즘에는 괜찮은 일을하고 프로덕션 환경에서 사용해야하는 수많은 라이브러리가 있습니다. 그러나, 내 질문은 두포 세부 사항에 관한 것이었다. 그래서 여기서 요청마다 전용 요청 객체를 갖는 lamda-calculus와 같은 방법을 발견했습니다.

function printResult(http) { 
    if (http.readyState == 4) { ... } 
    ... 
} 

function doAjax() { 
    var http = createRequestObject();  
    var request = 'SomeURL'; 

    http.open('get', request);  
    http.onreadystatechange = function() { printResult(http); }; 
    http.send(null); 
    return false; 
} 

성공적으로 크롬과 IE9에서 테스트 : 그 목적은 분명히 응답 등 도착할 때 호출되는 콜백 함수에 전달됩니다.

Answer 2

페이지 당 요청 대기열을 사용하여 (중복 요청을 억제하고 요청의 순차 순서를 보장하기 위해)이 시나리오를 처리했지만보다 표준화 된 솔루션이있을 수 있습니다.

기본적으로 제공되지 않으므로 페이지 (또는 링크 된 스크립트) 내에서 JavaScript로 구현해야합니다. Ajax 요청을 시작하는 대신 단추를 클릭하면 대기열에 요청이 추가됩니다. 대기열이 비어 있으면 대기열에있는 항목을 제거하고 다음 항목을 실행하는 콜백을 사용하여 Ajax 요청을 실행하십시오.

은 참조 : How to implement an ajax request queue using jQuery

Answer 3

AJAX 각 버튼과, 자연 asynchronus 가지고 있기 때문에 당신이 FROM/서버/POST 몇 가지 데이터를 얻을 것 비동기 이벤트를 발생시킬 것이다 클릭합니다. 하나의 콜백을 제공하므로 서버가 데이터 처리를 마칠 때까지 여러 번 트리거됩니다.

기본적으로 정상 동작이므로 http 개체를 다시 초기화하면 안됩니다. 여러 전송 작업을 표시하려면 수동으로 수행해야합니다 (예 : 첫 번째 호출이 수행 될 때 버튼을 비활성화).

jQuery $ .ajax를 사용하는 것이 좋습니다.