onbeforeunload 이벤트 에서 Ajax 를 호출 하여 사용자 로그아웃 작업 을 실현 합 니 다 (IE, Firefox, Chrome 호 환)

항상 이러한 수요 가 있 습 니 다. 바로 특정한 웹 페이지 를 떠 날 때 사용자 가 반드시 로그아웃 을 하지 않 으 면 세 션 을 제때에 소각 하지 못 할 수 있 습 니 다.사용자 가 페이지 를 떠 날 때 자동 로그아웃 기능 을 실현 하기 위해 서 는 웹 페이지 의 onbeforeunload 이벤트 처리 함수 에서 로그아웃 명령 을 보 내야 합 니 다.이곳 은 대부분 Ajax 로 이 루어 진다.도 메 인 방문 문제 도 있다.이곳 에는 브 라 우 저의 호환성 문제 가 존재 한다.
브 라 우 저 는 이 요 구 를 처리 할 때 다음 과 같은 두 가지 가 있 습 니 다.
1. Ajax 를 처리 할 때의 불 호환성 은 jQuery 로 해결 합 니 다.
2. Ajax 요청 을 보 낼 때 호 환 되 지 않 음
주요 코드 는 다음 과 같 습 니 다.

function logout() {
                var logoutURL = "xxxx"; //       url
                if (logoutURL == "") return;
                var userAgent = navigator.userAgent.toLowerCase();
                if(userAgent.indexOf("msie")>-1) { //IE
                    $.ajax({ url: logoutURL, crossDomain: true, async: false, dataType: "jsonp" });
                }else { //FireFox Chrome
                    $.ajax({ url: logoutURL, async: false });
                }
            }

            window.onbeforeunload = function () {
                logout();
            };

코드 설명:
fireforx 는 js 를 처리 할 때 보안 수준 이 높 고 IE, Chrome 에서 js 가 사용 할 수 있 는 권한 이 Friefox 에서 제한 되 어 있 기 때문에 통과 합 니 다.

if(userAgent.indexOf("msie")>-1) { //IE
                    
                }else { //FireFox Chrome
                    
                }

이 코드 는 현재 브 라 우 저 종 류 를 판단 합 니 다.
Firefox, Chrome 에 대한 호 환 코드 는 다음 과 같 습 니 다.

$.ajax({ url: logoutURL, async: false });

async 는 false, 즉 동기 화 를 설정 해 야 합 니 다. true 비동기 방식 을 사용 할 수 없습니다. 그렇지 않 으 면 요청 이 발송 되 지 않 을 수 있 습 니 다.사실 크롬 은 IE 에 대한 아래 코드 에 도 적 용 됩 니 다. 브 라 우 저 를 끌 때 자동 으로 로그아웃 명령 을 보 냅 니 다. 그러나 브 라 우 저의 새로 고침 단 추 를 눌 렀 을 때 도 자동 으로 사용 자 를 로그아웃 하 기 를 원할 때 크롬 은 위 코드 만 사용 해 야 로그아웃 요청 을 할 수 있 습 니 다.
IE 에 대한 호 환 코드 는 다음 과 같 습 니 다.

$.ajax({ url: logoutURL, crossDomain: true, async: false, dataType: "jsonp" });

crossDomain 을 true 로 설정 한 것 은 도 메 인 방문 문 제 를 해결 하기 위해 서 입 니 다. 이 문제 가 존재 하지 않 으 면 이 속성 은 무시 할 수 있 습 니 다.async 속성 은 false 로 설정 하 는 것 이 좋 습 니 다. true 도 가능 합 니 다.dataType: "jsonp" 라 는 속성 도 크로스 도 메 인 방문 문 제 를 해결 하기 위해 크로스 도 메 인과 함께 사용 합 니 다. 크로스 도 메 인 문제 가 존재 하지 않 습 니 다. 이 두 속성 은 생략 할 수 있 습 니 다.
이상 의 코드 는 IE9, Chrome 27, Firefox 21 테스트 에 통과 되 었 습 니 다.
다음으로 전송:https://www.cnblogs.com/liancs/p/3879257.html