不通过后端,仅仅前端,vue中如何设置页面的过期时间,比如10分钟无操作就退出?

swnuv
  • 3.8k

不用session控制,就纯前端,用vue如何做

回复
阅读 283
2 个回答
南客
  • 5
新手上路,请多包涵

1、建立个settimeout开始延时十分钟然后监听window的click有必要可以监听鼠标移动,触发就重新计时
window.addEventListener("click", function(e){});
2、同样是监听然后记录触发时间,与上次触发时间对比,如果超过指定时间退出

这比较简单,通过事件、定时器就能搞定。大致思路如下:

  1. body标签添加鼠标移入事件,主要用来鉴定是否操作页面,伪代码如下:
      document.addEventListener('mouseover',() => {
        this.timerCount = 0
        //如果开启了定时器,则清除,重新赋值,并重新计数
       if(this.timer) {
          clearInterval(this.timer);
          this.timer = null
       }
      })
  1. 初始化设置一个定时器变量timer,并给它赋值,伪代码如下:
this.timer = setInterval(()=>{
  this.timerCount++
  if(this.timerCount == 10*60) {
    //退出登录
    //清除定时器
  }
}, 1000)
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
宣传栏