사용자가 브라우저 창을 닫기 전에 AJAX 요청을 안정적으로 보내고 스크립트를 실행하려면 어떻게 해야 합니까?

JavaScript에서 AJAX 요청 및 스크립트에 대한 창 닫기 관리

챌린지

사용자는 창을 닫거나 탐색하는 등 다양한 방법으로 웹페이지를 떠날 수 있습니다. 다른 URL을 통해 멀리 떨어져 있습니다. 사용자가 페이지를 떠나는 순간을 파악하고 해당 작업을 실행하는 것은 어려울 수 있습니다.

해결책

2024년 업데이트:

• Beacon API: Beacon API는 최신 브라우저에서 안정적인 솔루션을 제공하여 다음을 보장합니다. 사용자가 페이지를 떠날 때에도 완료를 요청합니다.
• Visibilitychange 이벤트: 이 이벤트는 수동 상태에서 숨겨진 상태로의 전환을 포함하여 대부분의 브라우저에서 관찰할 수 있는 마지막 상태 변경을 캡처합니다.

구현

가시성 변경 이벤트:

document.addEventListener('visibilitychange', function() {
  if (document.visibilityState === "hidden") {
    // Trigger AJAX request or run script
  }
});

Beacon API:

var url = "https://example.com/foo";
var data = "bar";

navigator.sendBeacon(url, data);

세부정보

Beacon API는 사용자가 요청을 완료할 수 있도록 설계되었습니다. 페이지를 떠나세요. 사용자가 페이지를 종료한 시점을 감지하고 해당 시점에 비콘 요청을 트리거하려면 visiblechange 이벤트를 활용하는 것이 좋습니다.

Lifecycle.js 라이브러리(이전 브라우저용):

이전 브라우저와의 호환성을 위해 lifecycle.js 라이브러리를 사용하여 페이지를 관리하는 것을 고려해 보세요. lifecycle.

고려 사항

• 광고 차단기: 광고 차단기는 특정 추적 도메인에 대한 비콘 요청을 차단할 수 있습니다.
• 교차 사이트 요청: 비콘 요청은 CORS 제한 사항을 따르고 쿠키를 포함하므로 다음에 대한 적절한 구성을 확인하십시오. 교차 출처 요청.

위 내용은 사용자가 브라우저 창을 닫기 전에 AJAX 요청을 안정적으로 보내고 스크립트를 실행하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!