直接关闭浏览器调用注销接口会导致刷新页面时意外退出。本文介绍通过后端延时注销定时器与前端尽早清除定时器的机制，解决关闭标签页与刷新页面时的会话冲突，确保账户安全且不影响正常刷新体验。
经典做法
为了保障账户安全，当用户未主动点击注销按钮而直接关闭浏览器或标签页时，系统需要强制退出系统。
// 关闭时调用注销接口
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关闭浏览器时退出账号内容请搜索本站以前的文章或继续浏览下面的相关文章希望大家以后多多支持本站！