关闭浏览器用户退出登录的一种实现方式

今天遇到一个需求，用户关闭浏览器后需要退出登录，且token需要失效。 整体的思路就是监听beforeunload事件，然后向后端发送退出请求。

window.addEventListener('beforeunload', function () {  
    fetch("/logout", {  
            method: 'get',  
            keepalive: true  
        })  
    }  
})

但是这样会有两个问题，一个是没有区分刷新页面和关闭页面，刷新页面也会退出登录，第二个问题是Firefox浏览器无法发送请求出去。针对第二个问题将fetch替换成navigator.sendBeacon()。

window.addEventListener('beforeunload', function () {  
    navigator.sendBeacon('/logout');  
})

这样所有浏览器都能正常发送请求了。 然后就是解决刷新的问题了，如果刷新就会马上发送新的请求到后端，token的有效期会刷新，如果是关闭则不会，所以将退出请求改成一个修改token有效期为2s，刷新后token会恢复原有的有效期比如30分钟，关闭页面则token会在2s后过期。