vue浏览器在关闭窗口前触发登出 ?

作者站长头像
站长
· 阅读数 7

需求:浏览器在关闭前需要先退出登录问题:在关闭浏览器时登出的操作还没执行完就关闭了,如何在操作完后再关闭(谷歌不能修改浏览默认弹窗,没法做操作)

mounted(){
 window.addEventListener('beforeunload', e => this.beforeunloadHandler(e))
    window.addEventListener('unload', e => this.unloadHandler(e))
},
destroyed() {
    window.removeEventListener('beforeunload', e => this.beforeunloadHandler(e))
    window.removeEventListener('unload', e => this.unloadHandler(e))
  },
methods:{
    beforeunloadHandler(e) {
      this._beforeUnload_time = new Date().getTime();
    },
    unloadHandler(e) {
      this._gap_time = new Date().getTime() - this._beforeUnload_time;
      //判断是窗口关闭还是刷新
      if (this._gap_time <= 5) {
        //如果是登录状态,关闭窗口前,移除用户
        this.$store.dispatch('AGENT_LOGOUT')
      }
    }
}
回复
1个回答
avatar
test
2024-07-10

换个思路:既然页面都关掉了,那登录状态就不要紧了,所以不用管就行了,人都没了,土葬和火化那都是后人的事情了。

什么?怕别人接着用这个电脑?这个简单,每次进入网页的时候火速清空上次的登录信息就行了。如果担心别人离线恢复持久化存储的数据——那这数据就不应该持久化存储。

什么?后端要统计登录时长?浏览器弄了个叫做 sendBeacon 的接口就是干这个的。

什么? sendBeacon 成功率不是百分之百?既然要求这么高,不如考虑开一个 WebSocket,后端监听它断掉的事件就知道确切的离线时间了。

回复
likes
适合作为回答的
  • 经过验证的有效解决办法
  • 自己的经验指引,对解决问题有帮助
  • 遵循 Markdown 语法排版,代码语义正确
不该作为回答的
  • 询问内容细节或回复楼层
  • 与题目无关的内容
  • “赞”“顶”“同问”“看手册”“解决了没”等毫无意义的内容