全局页面无操作15分钟后自动退出登录

GGO_Mr

已于 2024-08-03 10:37:44 修改

阅读量1.6k

点赞数

文章标签： javascript 前端开发语言 php html5

于 2022-05-10 15:31:53 首次发布

本文链接：https://blog.csdn.net/GGO_Mr/article/details/124689450

版权

本文介绍了如何在前端实现全局页面无操作15分钟后自动触发退出登录的功能。通过创建一个JavaScript文件，将特定代码引入HTML，并在公共JS文件的自执行函数中添加该逻辑。至于PHP的退出登录处理部分，需要开发者自行编写代码来完成。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

首先创建个js文件把以下代码复制进去

var maxTime = 900; // seconds
time = maxTime;
$('body').on('keydown mousemove', function(e){
	time = maxTime; // reset
});
var intervalId = setInterval(function(){
	var times  = localStorage.getItem('time'); //读取缓存

	if (times) {
		time = times;
		localStorage.removeItem('time'); //删除缓存
	}
	
	time--;
	if(time <= 0) {
		logout();
		clearInterval(intervalId);
	}
}, 1000);
function logout(){ //无效的登录信息 退出登录
	var out = 1; //设置一个虚拟值 发送ajax 请求logout方法
	$.ajax({
		url:"/admin/publicc/logout",  //发送Ajax请求
		type:"post",
		data:{out:out},
		cache: false,
		processData: false,
		contentType: false,
		success:function(data){
			if(data.code == 1){
				window.location.href="/admin/Publicc/login";
			}
		},
	});
}

在当前框架最外层htlm 引入当前js文件

  <script src="/static/admin/js/loginOut.js"></script>

在这里插入图片描述

在公共js文件里找到自执行函数并把下面代码复制进去

    // 15分钟无操作定时关闭系统
    $('body').on('keydown mousemove', function(e){
        localStorage.setItem('time','900'); //设定缓存key 并设定时间
    });

在这里插入图片描述
PHP 退出登录的代码自己写吧…加油骚年!!!