• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

js关闭浏览器时退出账号的处理

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

经典做法

众所周知,为了账户安全,用户未主动点击注销系统时,直接关闭浏览器或标签页强制退出系统的方法:

// 关闭时调用注销接口
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关闭浏览器时退出账号内容请搜索极客世界以前的文章或继续浏览下面的相关文章希望大家以后多多支持极客世界!


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
JavaScript之BOM构成和常用事件详解发布时间:2022-02-05
下一篇:
详解Vue与VueComponent的关系发布时间:2022-02-05
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap