Idle Detection API 沙盒 - 检测用户是否离开

操作步骤

第一步：检查浏览器兼容性

打开工具页面后，系统会自动检测当前浏览器是否支持 Idle Detection API。如果浏览器不支持，页面顶部会显示兼容性提示信息。推荐使用 Chrome 94+ 或 Edge 94+ 并通过 HTTPS 访问。兼容性检测结果会以醒目的彩色标签展示，绿色表示支持，红色表示不支持，让你一目了然。

第二步：请求检测权限

点击「请求权限」按钮，浏览器会弹出权限对话框。你可以选择「允许」、「阻止」或忽略（等待超时自动关闭）。只有选择「允许」后才能启动检测。权限状态会显示在界面上，从 prompt 变为 granted 或 denied。如果权限被拒绝，工具会提示用户在浏览器设置中手动重置权限后重试。

第三步：设置空闲阈值

拖动阈值滑块设置触发空闲状态的等待时间。默认值为 60000 毫秒（60 秒），这是浏览器的最低要求。你可以将其设置为 15 秒到 300 秒之间的任意值，用于观察不同灵敏度下的检测效果。较短的阈值适合快速验证检测逻辑，较长的阈值适合模拟真实使用场景中的用户行为模式。

第四步：启动检测

权限获取后，「启动检测」按钮变为可用状态。点击后，API 开始监听用户的空闲和屏幕锁定事件。界面上的用户状态和屏幕状态指示器会实时更新。启动后按钮变为「停止检测」状态，可通过红色按钮随时终止检测进程。

第五步：观察状态变化

尝试离开电脑一段时间，或锁定屏幕，观察状态指示器的变化。当空闲时间超过阈值时，用户状态会从 active 变为 idle。解锁屏幕后，屏幕状态会从 locked 变为 unlocked。所有变更都会记录在日志中，包含精确的时间戳和状态变化前后对比信息。

第六步：停止检测

点击「停止检测」按钮或直接关闭页面，检测会自动终止。使用 AbortController 确保资源被正确释放。停止后可查看完整日志记录，分析整个检测过程中的状态变化规律和时间分布特征。

开发者集成建议

在生产环境中，建议在用户即将进入需要空闲检测的功能时才请求权限，而非页面加载时立即请求。同时提供降级方案，当 API 不可用时回退到传统的事件监听方式。始终尊重用户隐私，仅将空闲状态用于提升用户体验。定期检查 API 的浏览器支持情况，及时更新兼容性策略以应对浏览器版本变化。