后台管理系统如何保持登录状态

后台管理系统如何保持登录状态

我们的需求是这样的：登录页有保持登录这一选项，保持登录就是除非登录时间超时，否则可以在任何页面打开；其实保持登录不用做，直接在用户关闭当前窗口的时候判断是否有保持登录这个状态，有的话不做处理，不保持登录就清除缓存 退出登录

首先监听关闭浏览器窗口事件

需要注意的是，window.onunload这个事件可以监听浏览器关闭，也能监听到浏览器刷新，所以我们根据他们触发的不同的时间来判断是关闭还是刷新（一般关闭时间比较短不会超过5毫秒）
在APP.vue全局监听

<script>
	//在登录进去的时候保存keeplogin状态，在App.vue中做出判断是否是保持登录
    //如果keeplogin==false 当前页面关闭的时候清除缓存 
     export default {
           mounted () {
                if(localStorage.getItem('keepLogin')== false){
                    let beginTime = 0;//开始时间
                    let differTime = 0;//时间差
                    window.onunload = function (){
                    differTime = new Date().getTime() - beginTime;
                    if(differTime <= 5) localStorage.clear();
                    };
                    window.onbeforeunload = function (){
                    beginTime = new Date().getTime();
                    };
                }
                
            }

     }
</script>