js關閉瀏覽器時退出賬號的處理

Posted on by

經典做法

眾所周知，為瞭賬戶安全，用戶未主動點擊註銷系統時，直接關閉瀏覽器或標簽頁強制退出系統的方法：

// 關閉時調用註銷接口
window.onbeforeunload = function() {
 //執行註銷ajax調用,簡單示例
 $.ajax({url:"/logout"});
};

問題

此方式有嚴重問題， 會造成刷新頁面時也被調用註銷， 很多系統必須支持刷新頁面保持會話，如何處理？

沒有辦法的解決方案， 但有效：

// 關閉時調用註銷接口
window.onbeforeunload = function() {
 //執行註銷ajax調用, 傳入標志, 告訴後臺延時註銷
 $.ajax({url:"/logout"},data:{delay:true});
};

後臺註銷接口根據delay標志， 設置定時器，進行延時註銷， 比如設置5秒定時器，5秒後，才真正註銷應用系統會話。

同時，前端頁面加載後，要立刻調用一個清除註銷的接口， 告訴後臺刪除延時註銷定時器，確保刷新頁面時放棄之前的註銷操作，以保持應用會話。

進一步問題

後臺定時器設置多少延時可靠？ 當然希望越短越好， 因為可以確保用戶關閉瀏覽器後， 重新打開頁面，不至於重新保持會話， 例如後臺設置5秒定時器， 用戶關閉瀏覽器， 重新打開頁面之間間隔隻要大於5秒， 則會話將不會恢復， 確保重新進入登陸頁面。 當然，如果用戶手速過高，5秒內重新打開頁面，則會成功進入上一個會話， 當然這不會造成嚴重問題， 因為惡意用戶不可能非常快的使用用戶離開的電腦並打開頁面。

然後呢？ 到底設置多少秒延時為好？ 這取決於 前端代碼加載頁面時調用清除延時註銷定時器的時機， 關鍵點是，越早越好。
如何越早呢？ 當然是 需要把此調用放在主頁的盡可能提前的代碼中，比如：

<html manifest="">
 <head>
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta charset="UTF-8">
  <meta http-equiv="Pragma" content="no-cache">
  <meta http-equiv="Cache-Control" content="no-cache">
  <meta http-equiv="Expires" content="0">
  
  <script type="text/javascript">
   //為瞭盡快調用清除延時註銷定時器， 使用原始XMLHttpRequest方式進行調用
   var xhr = new XMLHttpRequest();
   if (xhr) {
    xhr.open("POST", '/clearlogout', true);
    xhr.send();
   }
  </script>

  ......

經過上述處理， 一般正常的網絡情況下， 刷新頁面操作可確保 調用延時註銷 和 清除延時註銷之間的時間間隔很短， 一般來說， 5秒是較為合理的延時值。
使用此機制的使用可根據偏好， 比如希望更安全，還是希望更確保刷新體驗， 來決定延長還是縮短延時調用定時器。

需要註意問題

顯然，上述機制必須依賴後端雙層會話機制，因為前提是必須首先支持刷新頁面會話保持， 所以 表層是web框架本身的session, 內層是應用層會話。 表層會話依賴cookie,內層應用會話依賴後臺緩存機制或者數據庫

到此這篇關於js關閉瀏覽器時退出賬號的處理的文章就介紹到這瞭,更多相關js關閉瀏覽器時退出賬號內容請搜索WalkonNet以前的文章或繼續瀏覽下面的相關文章希望大傢以後多多支持WalkonNet！

推薦閱讀：