当前位置：首页 > article >正文

WEB系统页面超过一定时间就自动跳转至登录页（或退出）

article 2024/9/18 19:51:23

需求

实现用户操作页面，如果长时间未操作（如五分钟），就自动跳转到登录页重新登录才能操作。

实现方式

通过一段前端代码就可以进行实现：
把下面这段代码，加到进入系统加载的js中，就可以实现。

// 记录最后一次的操作时间
// 定义一个全局变量，用于保存最后一次操作时间
var lastActivityTime = new Date();

// 监听用户的操作事件
 window.onload = function () {
     document.addEventListener('mousemove', resetTimer);
     document.addEventListener('keydown', resetTimer);
     document.addEventListener('scroll', resetTimer);
     document.addEventListener('touchstart', resetTimer);
 }

// 定义一个定时器，定时检查用户最后一次操作时间是否超过5分钟
 var timer = setInterval(function () {
     var currentTime = new Date();
     var timeDiff = currentTime.getTime() - lastActivityTime.getTime();
     if (timeDiff > 5 * 60 * 1000) {
         // 跳转至登录页面
         window.location.href = 'LogoutA2';
     }
 }, 10000); // 每隔10秒检查一次最后一次操作时间


// 重置定时器
function resetTimer() {
    lastActivityTime = new Date();
}