jQuery ajaxError () 핸들러가 페이지를 떠나면 페이지가 페이지를 떠나면로드가 끝납니다.

StackOverflow https://stackoverflow.com/questions/1906023

  •  19-09-2019
  •  | 
  •  

문제

우리는 jQuery의 Global AjaxError () 핸들러를 사용하여 AJAX 실패를 사용자에게 알립니다.

$(document).ajaxError(function() {  
    $("There was a network or server error. Please try again later.").dialog({  
        title: "Error",  
        modal: true,  
        resizable: false,  
        buttons: { 'Ok': function() { (this).dialog("close"); } }  
    });  
});

불행히도,이 글로벌 오류 핸들러는 사용자가로드가 완료되기 전에 페이지를 떠나면 발사됩니다. 오류를 재현하는 단계는 다음과 같습니다.

  1. AJAX를 통해로드하는 요소가 포함 된 사용자 방문 페이지 A를 방문합니다.
  2. 페이지의 Ajax 요소는로드를 시작합니다.
  3. 사용자는 링크를 클릭하여 페이지를 방문합니다. b ~ 전에 페이지 A의 Ajax 요소가로드를 완료했습니다.
  4. 브라우저가 페이지 B로 리디렉션되기 전에 오류 대화 상자가 간단히 나타납니다.

사용자가 새 페이지를 방문하여 오류가 직접 발생할 때 ajaxerror ()를 얻지 못하는 방법을 알고 있습니까?

업데이트 : 여기에 내 코드가 있습니다. 의견에 제안 사항을 통합 한 후 다음과 같습니다.

// I added a 3 second delay to our error dialog, enough time
// for the user to leave for a new page:
$(document).ajaxError(function() {
    setTimeout(my_error_handler, 3000);
});

// Warn user before leaving page if AJAX is still loading.
// Not sure I'll keep this:
$(document).ajaxStart(function() {
    ajaxing = true;
});

$(document).ajaxStop(function() {
    ajaxing = false;
});

window.onbeforeunload = function() {
    if (typeof(ajaxing) != 'undefined' && ajaxing) {
        return "Page elements are still loading!";
    }
};
도움이 되었습니까?

해결책

그렇습니다. 사용자가 다른 페이지로 탐색하면 XHR이 중단됩니다. 이는 사실상 커뮤니케이션이 실패합니다. 솔루션은 청취자를 등록하는 것입니다. onbeforeunload 이벤트, 그리고 undind ajaxError 기본적으로 다음과 같이 말합니다. 사용자는 페이지를 떠나려고하므로 다음에 따라 할 수있는 AJAX 오류를 알리고 싶지 않습니다.

그러나 Gmail과 같은 일부 사이트는 다른 방법으로 수행합니다. Ajax 요청이 아직 남아있는 동안 페이지에서 멀리 이동하려고하면 일부 프로세스가 여전히 실행 중이며 알려진 프롬프트가 제공됩니다. 사용자는 요청이 완료 될 때까지 사이트에 머무를지 여부를 결정하거나 계속 이동해야합니다.

다른 팁

위의 David Hedlund의 답변을 바탕으로 여기에 적합한 코드가 있습니다.

//enable global ajax error handling
$(document).ajaxError(function (event, request, settings) {
    //your error handling code here
});

//user leaving page so ignore any unfinished ajax loads
$(window).bind('beforeunload', function () {
    $(document).unbind('ajaxError');
});

나는 얻었다 'ajaxError' 주석 섹션에서 사양 jQuery ajaxerror 문서. 나는 묶어야했다 beforeunload 에게 $(window) 크롬을 지원하기 위해 (즉, 문서와 잘 작동했습니다). .ajaxError 내가 구속력이 있었을 때 발사하지 않았다 $(window) 이것이 바로이 창/문서 솔루션이있는 이유입니다.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top