>웹 프론트엔드 >JS 튜토리얼 >JavaScript에서 브라우저 창 닫힘을 어떻게 안정적으로 감지할 수 있습니까?

JavaScript에서 브라우저 창 닫힘을 어떻게 안정적으로 감지할 수 있습니까?

Patricia Arquette
Patricia Arquette원래의
2024-11-27 16:23:10956검색

How Can I Reliably Detect Browser Window Closure in JavaScript?

JavaScript: window.close 이벤트를 통해 창 닫기 감지

문제:

window.close 이벤트 캡처가 필요합니다. 사용자가 브라우저 창을 닫거나 특정 창에서 벗어나는 경우를 감지합니다. 페이지.

해결책:

이 솔루션의 구현은 브라우저 호환성에 따라 다릅니다.

2024년 업데이트:

  • 비콘 API: 사용자가 페이지를 종료해도 완료되는 POST 요청입니다. 세션 데이터, 분석 등을 전송하는 데 적합합니다.
  • 가시성 변경 이벤트: 문서가 "숨겨진" 상태(페이지가 닫히거나 다른 곳으로 이동)로 전환될 때 트리거되는 신뢰할 수 있는 마지막 이벤트입니다.

세부정보:

비콘 API

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

navigator.sendBeacon(url, data);

가시성 변경 이벤트

document.addEventListener('visibilitychange', function() {
  if (document.visibilityState === "hidden") {
    // Send Beacon request or perform other actions
  }
});

크로스 브라우저 지원:

이전 브라우저 지원이 필요한 경우 라이프사이클 .js 라이브러리는 다음과 같습니다. 사용됨:

lifecycle.addEventListener('statechange', function(event) {
  if (event.originalEvent == 'visibilitychange' && event.newState == 'hidden') {
    // Send Beacon request or perform other actions
  }
});

제한 사항:

  • Adblocker는 sendBeacon 요청, 특히 원본 간 요청을 방해할 수 있습니다.
  • 교차 사이트 요청에는 CORS 제한이 적용됩니다.

위 내용은 JavaScript에서 브라우저 창 닫힘을 어떻게 안정적으로 감지할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.