javascript - 如何检测 React Web 应用程序中的空闲时间？

Question

我正在开发一个包含空闲时间检测功能的反应网络应用程序（小型项目）。该应用程序应检测整个系统的（操作系统）空闲时间。如果用户关闭浏览器，我的意思不是用户空闲应用程序，而是整个系统/操作系统：没有键盘输入，没有鼠标操作，即使没有对应用程序或应用程序的关注最小化，也没有触摸。有什么方法可以实现吗？

Answer 1

这是一个在 React 中实现空闲超时的示例项目。你可以克隆这个项目并在你的机器上运行它。

// clone the project
git clone https://github.com/bbachi/react-idle-timeout.git
// install dependencies and start the project
npm install
npm start

这是一个简单的项目，它有两个屏幕：登录屏幕和仪表板屏幕。

当您使用任何用户名和密码登录时，仪表板会显示一些用户表。如果您空闲 5 秒，我们将通过模式窗口通知用户，如果用户在 5 秒后仍然空闲，则用户将被注销。

有关详细信息，此博客文章似乎支持该想法。