ajax 요청 취소 : 핸들러를 여전히 실행 할 수 있습니까?

Question

Is JavaScript guaranteed to be single-threaded? javascript가 단일 스레드임을 분명히 알 수 있습니다. 여전히주의 사항이 있습니다.

var lastReq; 
$('#button').click(function() 
{ 
    if (lastReq) lastReq.abort(); 
    lastReq = $.ajax(...); 
}); 

는 경우가 될 수있다 (내가 jQuery를 '사용'하고있어) 나는 다음 의사 코드는 항상 예측할 수 있는지 궁금 해서요

하는 클릭 이벤트와 중지, 서버에서 데이터 사이 이벤트 큐를 통해 이벤트를 가져 왔습니다. 이것이 중단 직전에 발생하면 아약스 게시물의 succes 이벤트가 트리거됩니다. 이 경쟁 조건을 실제로 테스트하는 방법을 모르겠습니다.

누구나 어떻게 작동하는지 알고 있나요? 또는 예제를 사용하여이를 테스트하는 방법은 무엇입니까?

Answer 1

편집 : 요청을 중단하는 즉시 브라우저에서 더 이상 듣지 않아야합니다. 그래서 이벤트 대기열의 응답에 도달하면 내 추측은 그냥 버려야한다는 것입니다. 당신이 문제가 발생하는 경우

---

그러나, 당신은 시도 할 수 다음

당신은 당신의 성공 기능 + 그것이 더 이상 할 필요가 감지하지 않는 경우 자체를 취소 할 수있는 URL에 체크를 할 수 있나요 도망쳐?

예를 들어

(그리고 난 당신이 이런 식으로해야 말하는 게 아니에요, 나는 jqXHR 요청에 아무것도 연결 시도하지 않은) :

var numReq = 0, lastReq; 

$('#button').on('click', function(e) { 
    if (lastReq) { lastReq.abort(); } 
    numReq ++; 
    lastReq = $.ajax({ 
     success : function(d, s, x) { 
      if (x.reqNum < numReq) { return; } 
     } 
    }); 
    lastReq.reqNum = numReq; 
}); 

나의 이해는 아약스 이벤트가되지 않을 것입니다 당신은 (이론적으로) 아약스 후 reqNum 설정에 대해 걱정할 필요가 없습니다 있도록 버튼 클릭 후까지 이벤트 큐에 추가 된

---

나는 또한 다음과 같은 코드를 시도했습니다 ..., 수행 :

var numReq = 0, lastReq, timer = 100, 
    c = setInterval(function() { 
     if (lastReq) { lastReq.abort(); } 
     numReq ++; 
     lastReq = $.ajax({ 
      url  : 'index.html', 
      cache : false, 
      success : function(d, s, x) { 
       if (x.reqNum < numReq) { console.log('it happens'); } 
      } 
     }); 
     lastReq.reqNum = numReq; 
    }, timer); 

가능한 한 페이지의로드 시간을 시도하고 일치시키기 위해 타이머를 다양 화합니다. 나는 "일어난다"는 것을 보여주지 못했습니다.

Answer 2

내가 jQuery를 1.5 아약스 방법이 지연된 개체를 반환하기 때문에 lastReq 사용할 수 state() 방법을 가지고,이 해결 방법은 정말 유용하고 방탄이 될 수 있는지 알고 (내가 창조하기 위해 노력하고있어)하지만하지

http://api.jquery.com/deferred.state/

deferred.state() 메서드는 Deferred 개체의 현재 상태를 나타내는 문자열을 반환합니다.

은 "해결" ...

: 이연 객체는 3 가지 상태로있을 수있는 이연 개체를 의미 해결 된 상태입니다 deferred.resolve() 또는 deferred.resolveWith (중)가 호출되었으며 doneCallbacks는 (또는 호출되는 중)이라고합니다.

은 그래서 당신은이 작업 할 당신에게 아이디어를 제공하는 데 도움이 될 수 있도록

var lastReq; 
$('#button').click(function() { 
    if (lastReq) { 
     if (lastReq.state() === "resolved") { 
      return false; /* done() of the previous ajax call is in the process of 
           being called. Do nothing and wait until the state 
           is resolved */ 
     } 
     else { 
      lastReq.abort(); 
     } 
    } 

    lastReq = $.ajax(url).done(function() { 
      /* do something */ 
      lastReq = null; 
    }); 
}); 

희망과 같은 코드를 리팩토링 수 있지만, 나는 더 정말 해결 방법

이런 종류의 필요가 없습니다 의심