如何机智判断页面是刷新还是关闭，背景：vue项目，需求：关闭页面，下次直接跳到登陆页

最近项目有这么个需求：要在关闭当前系统的窗口的时候，退出登录，

因为如果不退出登录可能存在安全风险，其实我想说，电脑没事别借给别人活着离开工位记得一定要锁屏，其实我们设置了cookie失效时间的，过了一段时间会自动清空cookie。

经过我查资料，自身尝试网上的各种方法，发现都有问题。

总结这一路的尝试：

一、页面加载时只执行onload ，页面关闭时只执行onunload，页面刷新时先执行onbeforeunload，然后onunload，最后onload。

经过验证我得出的结论是：

（1）对于ie，谷歌，360：

//页面加载时只执行onload//页面刷新时，刷新之前执行onbeforeunload事件，在新页面即将替换旧页面时onunload事件，最后onload事件。//页面关闭时，先onbeforeunload事件，再onunload事件。

（2）对于火狐：

//页面刷新时，只执行onunload；页面关闭时，只执行onbeforeunload事件那么回归正题，到底怎样判断浏览器是关闭还是刷新？我按照网上的各种说法实验千百遍，都未成功，

二、机智的判断页面刷新还是关闭

关键点：

我的思路是：

import Cookies from 'js-cookie'

<span style="color: #008000;">/<span style="color: #008000;">区分关闭和刷新，关闭退出登录 start<span style="color: #008000;">/<span style="color: #000000;">
window.onload = <span style="color: #0000ff;">function<span style="color: #000000;">(){
<span style="color: #0000ff;">if(!window.sessionStorage["tempFlag"<span style="color: #000000;">]){
Cookies.remove('userId'<span style="color: #000000;">)
Cookies.remove('userName'<span style="color: #000000;">)
location.reload(); <span style="color: #008000;">//<span style="color: #008000;">不能省，强制跳到登陆页
}<span style="color: #0000ff;">else<span style="color: #000000;">{
window.sessionStorage.removeItem("tempFlag"<span style="color: #000000;">);
}
}
window.onunload = <span style="color: #0000ff;">function<span style="color: #000000;"> (){
window.sessionStorage["tempFlag"] = <span style="color: #0000ff;">true<span style="color: #000000;">;
}
window.onbeforeunload = <span style="color: #0000ff;">function<span style="color: #000000;"> (){
window.sessionStorage["tempFlag"] = <span style="color: #0000ff;">true<span style="color: #000000;">;
}

目前项目中使用时可行的，不足的地方：一个系统的多个页面同时打开，关掉其中一个页面也会清空cookie，重新登录

谁让项目登录用的是cookie存，如果换成session存登录信息就不一样了