当前位置: 移动技术网 > IT编程>开发语言>JavaScript > vue中js判断长时间不操作界面自动退出登录(推荐)

vue中js判断长时间不操作界面自动退出登录(推荐)

2020年03月09日  | 移动技术网IT编程  | 我要评论

需求说明,后台有做半个小时不请求接口的话返回标识退出登录,但是要请求接口才行,现在要实现前端用js判断半个小时不操作界面的话自动跳转到登录页面。

创建一个.js文件,在main.js引入此js(vue框架)

在登录成功的时候保存当前时间localstorage.setitem("lasttime",new date().gettime());

然后在点击的时候更新这个时间

var lasttime = new date().gettime();
var currenttime = new date().gettime();
var timeout = 30 * 60 * 1000; //设置超时时间: 30分
 
window.onload = function () {
  window.document.onmousedown = function () {
    localstorage.setitem("lasttime",new date().gettime());
  }
};
function checktimeout() {
  currenttime = new date().gettime(); //更新当前时间
  lasttime = localstorage.getitem("lasttime");
  // console.log(currenttime - lasttime);
  // console.log(timeout);
  if (currenttime - lasttime > timeout) { //判断是否超时
    // console.log("超时");
    var url = window.location.href;
    var newurl=url.match(/(\s*)#/)[1];
    
    window.open(newurl + '#/login','_self');
  }
}
 
/* 定时器 间隔30秒检测是否长时间未操作页面 */
window.setinterval(checktimeout, 30000);

每隔30s去检查一下是否过了30分钟。

总结

以上所述是小编给大家介绍的vue中js判断长时间不操作界面自动退出登录,希望对大家有所帮助!

如对本文有疑问, 点击进行留言回复!!

相关文章:

验证码:
移动技术网