实现:关闭浏览器前,刷新浏览器前,切换浏览器tab,最小化浏览器等骚操作向后台发送请求(vue项目)
对于以上用户骚操作,向后台发送最后的指令,这里只做简单的记录
关闭浏览器和刷新浏览器在vue的生命钩子create函数中实现:通过window.onbeforeunload事件实现,这里要特别注意的是,接口请求必须是同步的
created() {
window.onbeforeunload = function() {
// 同步的接口请求
}
}
export function totalTime (param) {
return new Promise((resolve,reject)=>{
$.ajax({
contentType: 'application/json;charset=UTF-8',
type: 'post',
url: '',
data:,
asunc: false,
dataType: 'json',
success: function(res) {
resolve(res)
}
error: function(res) {
resject(res)
}
})
})
}
tab切换的实现:;有一个问题:不能把这个全局事件移除
document.addEventListener('visibilitychange',function(){ //浏览器切换事件
if(document.visibilityState=='hidden') { //离开当前tab标签
console.log("离开当前tab标签");
}else {/回到当前tab标签
console.log("回到当前tab标签");
}
});