可以用 Promise 封装闲置检测器，监听用户行为重置定时器，超时后 resolve 登出；支持 reset、cancel 方法及页面可见性判断，兼顾移动端与 iframe 兼容性。
可以用 Promise 封装一个基于用户行为（如鼠标移动、键盘输入、页面聚焦等）的闲置检测器，配合 setTimeout 和事件监听，在超时后 resolve 登出动作。核心思路是：每次用户有交互就重置定时器；定时器到期且无新交互，则触发登出逻辑。
监听用户活动并重置闲置计时
监听关键事件（mousemove、keydown、scroll、focus、click 等），在每次触发时清除旧定时器、设置新定时器。注意避免重复绑定，也需考虑页面可见性（如切换标签页）。
- 使用
document.addEventListener统一注册事件，推荐用debounce思路 —— 不是每动一下都重设，而是「最后一次操作后等待 N 秒」才判定闲置 - 用
document.hidden或visibilitychange事件辅助判断：页面不可见时可提前进入闲置状态，或暂停计时（按业务需求选择） - 将定时器 ID 存在闭包或模块变量中，确保能被正确清除
用 Promise 包装闲置超时逻辑
不直接暴露 setTimeout，而是返回一个 Promise，在闲置期满后自动 resolve（或 reject）登出操作。这样调用方可用 await 或 .then() 处理后续流程（如跳转登录页、清理 token）。
- Promise 构造函数内启动初始定时器，超时后调用
resolve()并传入登出原因（如"idle_timeout"） - 提供
reset()方法供外部手动重置（例如用户点击“继续会话”按钮） - 支持取消：返回一个带
cancel()方法的对象，调用后 clearTimeout 并 reject Promise（防止内存泄漏）
简单可复用的实现示例
以下是一个轻量封装：
立即学习“Java免费学习笔记（深入）”；
function createIdleLogout(timeoutMs = 10 * 60 * 1000) {
let timer = null;
let isCancelled = false;
<p>const reset = () => {
if (timer) clearTimeout(timer);
if (isCancelled) return;
timer = setTimeout(() => {
if (!isCancelled) {
resolve({ reason: 'idle_timeout' });
}
}, timeoutMs);
};</p><p>let resolve;
const promise = new Promise(r => { resolve = r; });</p><p>const events = ['mousemove', 'keydown', 'scroll', 'click', 'focus'];
const handler = () => !isCancelled && reset();</p><p>events.forEach(type => document.addEventListener(type, handler, { passive: true }));</p><p>// 页面可见性变化处理（可选增强）
document.addEventListener('visibilitychange', () => {
if (!document.hidden && !isCancelled) reset();
});</p><p>const cancel = () => {
isCancelled = true;
if (timer) clearTimeout(timer);
};</p><p>return {
promise,
reset,
cancel
};
}</p><p>// 使用方式：
const idleGuard = createIdleLogout(5 <em> 60 </em> 1000); // 5分钟
idleGuard.promise.then(({ reason }) => {
console.log('因闲置已登出');
localStorage.removeItem('auth_token');
location.href = '/login';
});
注意事项与优化点
实际项目中建议补充这些细节：
- 避免在 iframe 或跨域子页面中监听失败 —— 检查
document是否可用 - 移动端需额外监听
touchstart、touchmove - 登出前可弹窗提醒（如剩余 30 秒），此时应暂停倒计时并等待用户响应
- 服务端也应同步校验 session 过期时间，前端登出仅作体验优化，不可替代后端鉴权
