vue监听浏览器关闭
https://www.jianshu.com/p/ed6010ab868e
用vue做的项目,有个需求就是关闭浏览器的时候,需要往后台提交有个接口,来监听这个账号有没有下线。
网上找了很多种方法,一直没有实现。
主要困惑点:
1、浏览器关闭是事件,是什么
onbeforeunload、onunload 又是各种百度,
window.addEventListener( ‘beforeunload’,e =>(
执行…
) )
mounted () {
window.addEventListener('beforeunload', e => {
window.localStorage.removeItem('titleName')
});
},
mounted () {
window.addEventListener( 'beforeunload', e => this.set() );
},
methods:{
set(){
console.log('我是要调用的函数')
}
}
把请求接口放到 set中,关闭浏览器的时候是可以请求接口了,但是,刷新时候也请求,不符合要求。。。。然后又是各种百度
2、怎么区分浏览器刷新与关闭(网上找的方法,不知道出处是哪里,)
var _beforeUnload_time = 0,_gap_time=0;
window.onunload=function(){
_gap_time=new Date().getTime()-_beforeUnload_time;
if(_gap_time<=5){
//浏览器关闭
$.ajax({
url:'/movecheck/logout',
// dataType:"JSON",
cache:false,
type:'post',
async:false,
success:function(dt){
// console.log(dt)
},
error:function(dt){
}
})
}
}
window.onbeforeunload=function(){
_beforeUnload_time=new Date().getTime();
}
});
相关文章
- (尚009)Vue列表渲染
- 【Vue】ref和$refs
- Vue - 实现信纸输入写作,类似写明信片时的一张背景图片 + 横格纸效果(信纸格子与文字自动对齐、支持自定义背景图、文字或横线大小与颜色,一切由您 DIY 自定义样式)纯CSS完成支持任何vue项目
- SpringBoot + Mybatis + Vue的代码生成器
- Vue2.0 搭建Vue脚手架(vue-cli)
- Vue vue-awesome-swiper 的坑
- 【问题-vue-vuetify】vue执行npm run serve后浏览器端口:5000显示Cannot GET /
- 关于Vue中main.js,App.vue,index.html之间关系进行总结
- vue项目js和css文件名避免浏览器缓存再vue.config.js中配置
- vue项目积累
- Vue和微信小程序区别
- Vue(element ui)中行操作row参数的使用
- Vue富文本编辑器的使用vue-quill-deitor
- Vue&Cesium&Ribbon界面: 将桌面GIS搬进浏览器
- Vue实战第1章:学习和使用vue-router
- 宝塔配置vue反向代理Nginx解决
- SpringBoot+Vue实现的文件管理系统 附带详细运行指导视频
- 登录密码加密vue版(转载)
- 【VUE】vue配置Gzip压缩
- vue 插槽
- vue 简单留言本
- ejs结合vue实现SSR ,express+ejs+vue = 服务器端渲染 ?Vue-SSR的奇思妙想
- 解决VsCode启动Vue项目报错:‘vue-cli-service‘ 不是内部或外部命令,也不是可运行的程序 或批处理文件。
- Vue路由使用的几个注意点
- 【转】制作并发布第一个vue组件的npm包