session管理(15毫秒没有操作就退出)

可以粗略的理解为认证信息,是放在session中的,可以手动新建session,设置session的过期时间,这样就实现了用户登录后,多长没有进行操作,就自动退出登录。

1.需要自定义session管理器(15毫秒没有操作就退出)

    @Bean
    public DefaultWebSessionManager getdefaultWebSessionManager() {
        DefaultWebSessionManager sessionManager = new DefaultWebSessionManager();
        sessionManager.setGlobalSessionTimeout(15 * 1000);//单位是毫秒
        return sessionManager;
    }

2.在securitymanger中绑定这个session

@Bean
    public DefaultWebSecurityManager getdefaultWebSecurityManager() {
        DefaultWebSecurityManager defaultWebSecurityManager = new DefaultWebSecurityManager();
        defaultWebSecurityManager.setRealm(GetMyRealm1());
        defaultWebSecurityManager.setCacheManager(getehacche());
        defaultWebSecurityManager.setSessionManager(getdefaultWebSessionManager());
        return defaultWebSecurityManager;
    }

### 实现 React 应用中用户2小时无操作后自动退出登录 为了实现在 React 应用中当用户在两小时内没有任何操作时自动退出登录的功能,可以采用监听用户的活动事件并设置定时器的方法。一旦检测到任何鼠标移动、键盘输入或其他交互行为,则重置计时器。 #### 设置全局的无操作监测逻辑 创建一个自定义 Hook 来处理这个功能: ```javascript import { useEffect, useState } from 'react'; function useIdleTimer(timeoutMs) { const [isUserActive, setIsUserActive] = useState(true); useEffect(() => { let idleTime = 0; function resetIdle() { idleTime = 0; setIsUserActive(true); } function onVisibilityChange() { if (document.hidden) { setTimeout(() => !isUserActive && logout(), timeoutMs); // 如果页面不可见则启动超时机制 } else { resetIdle(); } } window.addEventListener('mousemove', resetIdle); window.addEventListener('keypress', resetIdle); document.addEventListener('visibilitychange', onVisibilityChange); const intervalId = setInterval(() => { idleTime += 1000; if (idleTime >= timeoutMs) { setIsUserActive(false); logout(); // 调用登出函数 } }, 1000); return () => { clearInterval(intervalId); window.removeEventListener('mousemove', resetIdle); window.removeEventListener('keypress', resetIdle); document.removeEventListener('visibilitychange', onVisibilityChange); }; }, [timeoutMs]); return isUserActive; } ``` 此代码片段实现了对用户活动状态的监控,并通过 `logout()` 函数来执行登出动作[^1]。 #### 将其集成到应用程序中 可以在顶层组件或者专门负责身份验证的状态管理部分引入上述 hook 并调用它。例如,在 App.js 中: ```javascript import React from 'react'; import { useIdleTimer } from './hooks/useIdleTimer'; const App = props => { useIdleTimer(7200000); // 传入毫秒数作为参数,这里是2*60*60*1000=7200000ms ... }; export default App; ``` 这里假设有一个名为 `useIdleTimer` 的钩子文件位于 hooks 文件夹下。这会使得整个应用范围内都能感知到用户的活跃情况,并且会在超过指定的时间长度之后触发登出流程。 #### 定义登出方法 确保存在一个有效的 `logout()` 方法用于清除认证信息以及导航至登陆页等必要的清理工作。通常情况下,该过程涉及移除本地存储中的 token 或者 session 数据,并重新定向到登录界面。 ```javascript function logout(){ localStorage.removeItem('authToken'); sessionStorage.clear(); history.push('/login'); } ``` 以上就是关于如何在一个基于 React 构建的应用程序里实现长时间未操作即自动注销这一特性的介绍。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值