无需登录 数据私有 本地保存

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

4
0
0
0

功能亮点

一键权限请求

点击按钮即可触发浏览器权限弹窗,用户可选择允许、拒绝或忽略。工具会实时显示当前权限状态(granted / denied / prompt),帮助开发者理解权限生命周期。权限状态的每次变化都会在日志中记录,方便追踪权限流转的全过程,掌握权限管理的最佳时机。

用户状态与屏幕状态双维度展示

同时监测两个独立维度:用户状态(active / idle)和屏幕状态(unlocked / locked)。两个维度独立运作,组合后可产生四种状态组合,覆盖常见的用户场景。每种状态以不同颜色的指示器展示,视觉区分明显,状态变化时会触发醒目的视觉反馈。

可调节空闲阈值

支持 15 秒到 300 秒的空闲阈值设置。阈值越短越敏感,越长越保守。开发者可以根据目标场景选择合适的阈值,观察不同设置下的状态切换频率。阈值调节后无需重启检测,新设置会在下一次状态检查时立即生效,方便对比不同阈值下的检测表现。

实时空闲时长计时器

以 mm:ss 格式实时显示用户已空闲的时间,帮助开发者直观感受从最后一次操作到触发 idle 状态的时间跨度。计时器每秒更新一次,精确反映用户离开后的持续时长,与阈值设置配合使用可以清晰观察触发时机。

状态变更日志

所有状态变更事件(用户状态切换、屏幕状态切换、检测开始停止)均以带时间戳的日志形式记录。每条日志包含事件类型、新旧状态值和精确时间戳。支持一键清空日志,便于反复测试不同场景下的状态变化模式。

浏览器兼容性检测

页面加载时自动检测 Idle Detection API 是否可用,并以醒目提示告知用户当前浏览器的支持情况,避免无效操作。检测结果包括 API 支持状态和安全上下文状态两项关键信息,帮助开发者快速定位环境问题。

AbortController 生命周期管理

演示使用 AbortController 管理检测的启动和停止,展示生产环境中推荐的资源管理方式,防止内存泄漏。当检测停止时,AbortController 会自动取消所有未完成的事件监听,确保系统资源被正确释放。这是 Web API 开发中的重要最佳实践。