整合營銷服務(wù)商
電腦端+手機端+微信端=數(shù)據(jù)同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數(shù)據(jù)同步管理
免費咨詢熱線：
公司的一個項目突然要加一個在關(guān)閉瀏覽器標(biāo)簽頁退出登錄的功能，當(dāng)時首先想到的就是獲取瀏覽器標(biāo)簽頁的關(guān)閉事件然后執(zhí)行退出登錄方法，瀏覽器標(biāo)簽頁的關(guān)閉事件有和：
onunload、onbeforeunload都是在刷新或關(guān)閉時調(diào)用，可以在<script>腳本中通過window.onunload來指定或者在里指定。
區(qū)別在于onbeforeunload在onunload之前執(zhí)行，它還可以阻止onunload的執(zhí)行。
//過多的就不介紹了，想具體了解的可以網(wǎng)上搜索。
通過上面介紹可以發(fā)現(xiàn)這兩種事件都是刷新或關(guān)閉時調(diào)用的，無法區(qū)分是在刷新還是在關(guān)閉
在網(wǎng)上一通搜索找到了一種解決方法，但是只適用于Chrome瀏覽器(文章末尾已貼出代碼)，我們項目是必須適配IE瀏覽器的......找了很多方法，但是在IE瀏覽器中都無法使用，感覺通過事件來觸發(fā)這條路暫時有點走不通，那就發(fā)散思維想想其它方法來實現(xiàn)，既然點擊事件暫時無法實現(xiàn)，那可不可以通過在瀏覽器存儲數(shù)據(jù)來判斷是否退出登錄了呢？然后就想到了
sessionStorage是Html5的特性,IE7以下瀏覽器不支持
sessionStorage生命周期為當(dāng)前窗口或標(biāo)簽頁
一旦窗口或標(biāo)簽頁被永久關(guān)閉了，那么所有通過sessionStorage存儲的數(shù)據(jù)也就被清空了
看完介紹很符合功能需求啊，其它瀏覽器也都支持，而且IE8以上瀏覽器也支持，完美
已經(jīng)找到解決方法了，直接開干：
1、首先在登錄成功后存儲一個數(shù)據(jù)
sessionStorage.setItem("browser_logout","ok");
2、在程序頁面中判斷browser_logout是否存在
<script type="text/javascript">
if(sessionStorage.getItem("browser_logout") != "ok"){
//退出登錄
$.get("/logout", function(){});
}
</script>
3、點擊退出登錄時清除存儲的數(shù)據(jù)
<script type="text/javascript">
function logout() {
//退出登錄后將browser_logout移除
sessionStorage.removeItem("browser_logout");
//退出登錄
$.get("/logout", function(){});
}
</script>
想必看完代碼也應(yīng)該發(fā)現(xiàn)其中存在著缺陷，退出登錄是在用戶關(guān)閉標(biāo)簽頁后，重新訪問程序頁面時才觸發(fā)退出登錄，而不是在點擊關(guān)閉頁面時就觸發(fā)的，但是在感官上關(guān)閉標(biāo)簽頁后再次訪問是退出登錄狀態(tài)的
暫時只能想到這種解決方法，如果你有好的解決方法請分享一下，謝謝！
貼一下適用于Chrome瀏覽器的代碼：
var _beforeUnload_time = 0, _gap_time = 0;
window.onunload = function (){
_gap_time = new Date().getTime() - _beforeUnload_time;
if(_gap_time <= 5) {//瀏覽器關(guān)閉
clearCookie();
}else{//瀏覽器刷新-chrome刷新
console.log(document.domain);
return confirm("確定要離開本系統(tǒng)么？");
}
};
window.onbeforeunload = function (){
_beforeUnload_time = new Date().getTime();
};
function clearCookie() {
//退出登錄
$.get("/logout", function(){});
} *請認(rèn)真填寫需求信息，我們會在24小時內(nèi)與您取得聯(lián)系。
