window. onbeforeunload () 이벤트 호출 ajax

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

            }; 

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 에서 제한 되 어 있 기 때문에 통과 합 니 다.
[javascript]
view plain
copy
print
?
if(userAgent.indexOf("msie")>-1) { //IE 

                     

                }else { //FireFox Chrome 

                     

                } 

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

이 코드 는 현재 브 라 우 저 종 류 를 판단 합 니 다.
Firefox, Chrome 에 대한 호 환 코드 는 다음 과 같 습 니 다.
[javascript]
view plain
copy
print
?
$.ajax({ url: logoutURL, async: false }); 

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

async 는 false 로 설정 해 야 합 니 다. 즉, 동기 화 입 니 다. true 비동기 방식 을 사용 할 수 없습니다. 그렇지 않 으 면 요청 이 발송 되 지 않 을 수도 있 습 니 다. 사실 Chrome 은 아래 IE 코드 에 도 적 용 됩 니 다. 브 라 우 저 를 끌 때 자동 으로 로그아웃 명령 을 보 냅 니 다. 그러나 브 라 우 저의 새로 고침 단 추 를 누 를 때 도 자동 으로 사용 자 를 로그아웃 할 수 있 기 를 바 랍 니 다. Chrome 은 위 코드 만 사용 해 야 로그아웃 요청 을 할 수 있 습 니 다.
 
IE 에 대한 호 환 코드 는 다음 과 같 습 니 다.
[javascript]
view plain
copy
print
?
$.ajax({ url: logoutURL, crossDomain: true, async: false, dataType: "jsonp" }); 

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

크로스 도 메 인 을 true 로 설정 한 것 은 크로스 도 메 인 접근 문 제 를 해결 하기 위해 서 입 니 다. 이 속성 이 존재 하지 않 으 면 무시 할 수 있 습 니 다. async 속성 도 false 로 설정 하 는 것 이 좋 습 니 다. true 로 설정 하 는 것 도 좋 습 니 다. dataType: "jsonp" 라 는 속성 도 크로스 도 메 인 접근 문 제 를 해결 하기 위해 서 입 니 다. 크로스 도 메 인 과 함께 사용 하면 크로스 도 메 인 문제 가 존재 하지 않 습 니 다.
 
이상 의 코드 는 IE9, Chrome 27, Firefox 21 테스트 에 통과 되 었 습 니 다.