$(표준)웹 페이지를 떠나기 전에 AJAX 호출이 완료될 때까지 언로드 대기

$(표준)웹 페이지를 떠나기 전에 AJAX 호출이 완료될 때까지 언로드 대기

이 질문에는 이미 답변이 있습니다.

JavaScript, 브라우저, 창 닫기 - AJAX 요청 전송 또는 창 닫기 시 스크립트 실행 (9개의 답변)

닫힘6년 전에요.

기본적으로 사용자가 내 어플리케이션에서 웹페이지를 탈퇴하면 AJAX를 사용하여 PHP 스크립트를 호출해야 합니다.이 스크립트는 웹페이지에서 보낸 시간을 데이터베이스에 삽입하고 페이지를 종료합니다.

사용자가 이전 페이지에서 특정 시간(예를 들어 2분)을 보내지 않으면 내 응용 프로그램의 웹 페이지에 액세스할 수 없기 때문에 AJAX 요청이 완료될 때까지 기다리는 것이 중요합니다.

다음은 내 jquery 코드입니다.

$(document).ready(function() {

    var teid = TEID;
    var startTime = new Date().getTime();

    $(window).unload(function() {
        var timeSpentMilliseconds = new Date().getTime() - startTime;
        var t = timeSpentMilliseconds / 1000 / 60;

        $.ajax({
            type: 'POST',
            url: '/clientarea/utils/record-time',
            data: 'teid=' + teid + '&t=' + t
        });
    });

});

웹 페이지를 떠나기 전에 AJAX 요청이 끝날 때까지 기다리도록 변경하려면 어떻게 해야 합니까?

편집:

또는, AJAX 요구를 1분 정도 반복하는 것이(간단하게)그게 가능한가요?

음, 당신은 설정할 수 있습니다.async: falseAJAX 콜에서 브라우저가 다른 작업을 수행하기 전에 요청이 완료될 때까지 대기하도록 합니다.단, 이 경우 요청 기간 동안 브라우저가 '정지'됩니다.

$.ajax({
    type: 'POST',
    async: false,
    url: '/clientarea/utils/record-time',
    data: 'teid=' + teid + '&t=' + t
});

매뉴얼:

^{기본적으로는 모든 요청이 비동기식으로 전송됩니다(즉, 기본적으로는 true로 설정됩니다).동기 요청이 필요한 경우 이 옵션을 false로 설정하십시오.교차 도메인 요청 및 dataType: "jsonp" 요청은 동기 작업을 지원하지 않습니다.동기요구는 일시적으로 브라우저를 잠그고 요청이 활성화되어 있는 동안 모든 액션이 비활성화될 수 있습니다.}

⚠ 경고: 이 답변은 2010년에 게시되었으며 현재는 구식입니다. XHR 규격에는 다음과 같은 내용이 강조되어 있습니다.

워커 이외의 동기 XMLHttpRequest는 최종 사용자의 경험에 악영향을 미치기 때문에 웹 플랫폼에서 삭제 중입니다.(이것은 오랜 시간이 걸리는 프로세스입니다.)현재 글로벌 개체가 Window 개체인 경우 개발자는 async 인수에 대해 false를 전달해서는 안 됩니다.사용자 에이전트는 개발자 도구에서의 이러한 사용에 대해 경고할 것을 강력히 권장합니다.또한 이러한 현상이 발생했을 때 "Invalid Access Error" DOMException을 던지는 실험을 할 수도 있습니다.

최근 Chrome의 DevTools가 이에 대해 경고하기 시작했기 때문에 (몇 년 전부터) 이러한 변화가 임박했을 수 있습니다.

가장 좋은 해결책은 navigator.sendBeacon을 사용하는 것입니다.이것은 브라우저의 새로운 릴리스에서 구현되기 시작한 새로운 기능입니다.이 기능은 Chrome 39 및 Firefox 31보다 새로운 브라우저에서 사용할 수 있습니다.쓰기 시 Internet Explorer 및 Safari에서는 지원되지 않습니다.아직 새로운 기능을 지원하지 않는 브라우저에서 요청이 전송되도록 하려면 다음 솔루션을 사용할 수 있습니다.

var navigator.sendBeacon = navigator.sendBeacon || function (url, data) {
  var client = new XMLHttpRequest();
  client.open("POST", url, false); // third parameter indicates sync xhr
  client.setRequestHeader("Content-Type", "text/plain;charset=UTF-8");
  client.send(data);
};

이게 도움이 됐으면 좋겠네요!

언로드 핸들러에 쿠키를 설정하는 것은 어떻습니까?서버는 후속 요청에서 이를 인식해야 합니다.

<script>
    $(window).unload(function(){document.cookie='left_on='+(new Date())})
</script>

브라우저가 닫힐 때까지 기다리는 것은 좋은 생각이 아닙니다.

페이지가 사용자를 괴롭히면 좋지 않습니다.

제 제안은 페이지에서 2분 동안 기다렸다가 사용자가 2분 동안 수행한 Ajax를 보내는 것입니다.

그 후 서버 측에서 2분의 여유가 있는지 없는지 확인할 수 있습니다.

사용자의 브라우저를 가로채려고 하는 것은 좋지 않습니다.사용자에게 나쁜 느낌을 주고 그들을 쫓아낼 수 있기 때문입니다.

어떤 이유로 사용자가 이전 페이지에서 최소한의 시간을 할애할 때까지 새 페이지를 생성하지 않으려면 서버 측을 파일럿하는 것이 가장 좋습니다.즉, 요청된 시간이 경과할 때까지 현재 페이지로 리디렉션합니다.

Ajax 콜을 할 필요도 없습니다.페이지가 서비스된 타이밍의 타임스탬프를 세션에 저장하고 일정 시간이 경과할 때까지 다음 페이지를 표시하지 않습니다.

사용자에게 새로운 페이지가 준비될 때까지 기다려야 한다고 꼭 말하세요. 어쩌면 간단한 Javascript 카운트다운으로.

사용자가 실제로 일정 시간 동안 페이지를 활성화(즉, 2분 동안 대기하는 다른 탭/창으로 전환하지 않음)하도록 하려면 효과적인 솔루션을 제안할 수 없습니다.

onbeforeunload:

$(document).ready(function(){
  window.onbeforeunload = function(){
     // $.ajax stuff here
     return false;
  }
});

하면 """를 수 .messagebox현재 창/탭을 닫을 것인지 묻습니다.

웹 서버에 부하가 걸리겠지만, 당신의 제안대로 폴링 기술을 사용하는 것이 좋을 것 같습니다.

$(document).ready(function() {

    var teid = TEID;
    var startTime = new Date().getTime();

    var ajaxFunc = function() {
        var timeSpentMilliseconds = new Date().getTime() - startTime;
        var t = timeSpentMilliseconds / 1000 / 60;

        $.ajax({
            type: 'POST',
            url: '/clientarea/utils/record-time',
            data: 'teid=' + teid + '&t=' + t
        });
    };

    setInterval(ajaxFunc, 60000);

})

웹소켓을 사용할 수 있게 되면 매우 기뻐할 것입니다.

jQuery.ajax()에는 method 옵션이 .async.로했을 경우false콜은 응답이 돌아올 때까지(또는 타임아웃이 될 때까지) 차단됩니다.이걸 부르면 브라우저가 언로드 핸들러에 들어가는 걸 멈출 것 같아서요.

사이드 노트:당신은 이것을 믿고 일을 할 수 없어요.브라우저가 사용자에게 언로드 핸들러를 취소할 수 있는 옵션을 제공하는 경우(일부 브라우저는 잠시 기다린 후 이를 수행함), "사이트에서 보내는 시간"은 업데이트되지 않습니다.서버에 있는 스크립트를 정기적으로 호출하여 시간을 갱신하는 타이머를 사이트에 추가할 수 있습니다.정확한 값은 알 수 없지만, 이 값은 필요하지 않습니다.

알가 있는 할 수 (「X초」를 사용).setTimeout(function, ms)사용자가 필요한 시간을 소비했을 때 콜을 발신합니다.따라서 언로드 핸들러가 필요하지 않습니다.

언급URL : https://stackoverflow.com/questions/3138498/window-unload-wait-for-ajax-call-to-finish-before-leaving-a-webpage