谷歌浏览器Idle Detection用户空闲检测配置

要在Chrome中实现网站对用户空闲状态的检测，需要满足HTTPS环境、用户手势触发、权限请求以及开启实验性Flag等条件。以下是完整的配置流程。

如果希望网站能够准确感知用户是否处于空闲状态，就需要深入了解IdleDetector API。该API的启用和具体行为受到浏览器策略、HTTPS环境、权限授予以及Chrome Flags的多重控制。下面详细介绍具体的配置方法。

一、开启实验性功能：Idle Detection API

Chrome默认情况下可能未开启此项API，需要手动进入Flags页面激活。这是后续所有检测逻辑能够运行的前提条件。

具体操作步骤如下：
1. 在Chrome地址栏输入chrome://flags/#enable-idle-detection并回车。
2. 在页面中找到Enable Idle Detection API选项。
3. 点击右侧下拉菜单，选择Enabled。
4. 页面底部会出现Relaunch按钮，点击重启浏览器即可使配置生效。

二、确保网站运行在合规环境中

IdleDetector API的初始化有一整套硬性要求。只要有一个条件不满足，API要么直接报错，要么默默失败，无法正常使用。

以下几点必须同时满足：
1. 网站协议必须是HTTPS，但localhost和127.0.0.1这两个地址例外。
2. 脚本必须在顶级浏览上下文中执行。普通iframe中无法直接调用。如果确实需要在iframe中使用，其HTML标签必须包含allow="idle-detection"属性。
3. 所有API调用（包括requestPermission()和detector.start()）都必须由用户手势触发，例如用户点击按钮或按下键盘按键。页面自动加载时执行不被允许。

三、通过浏览器策略管理空闲检测行为

对于企业管理员等高级用户，可以通过Chrome策略（如Windows组策略或macOS配置描述文件）对Idle Detection API的行为进行全局控制，覆盖用户级的所有设置。

操作路径如下：
1. 打开Chrome策略管理页面：chrome://policy/，确认策略已正常加载生效。
2. 配置策略项DefaultIdleDetectionSetting，可选项有三个：
- 设为1：允许网站使用空闲检测API，无需单独请求用户权限。
- 设为2：彻底禁止所有网站使用此API。
- 设为3：每次网站尝试使用API时，弹出权限请求对话框。

四、在网页中正确申请权限并启动检测器

开发者在实现时，必须遵循清晰的两阶段流程：先显式请求权限，再基于授权结果初始化IdleDetector实例。跳过任何一步都会导致构造失败，甚至抛出TypeError。

具体代码示例如下：
1. 在用户点击事件的处理函数中执行权限请求：

const permission = await IdleDetector.requestPermission();

2. 检查返回值是否等于'granted'。只有在权限被授予时才能继续初始化：

if (permission === 'granted') { const detector = new IdleDetector(); }

3. 设置空闲阈值。注意单位为毫秒，最小值为60000（即60秒）。如果设置的值低于此数，会被自动提升或直接抛出RangeError：

await detector.start({ threshold: 60000 });

4. 监听change事件，实时响应状态变化：

detector.addEventListener('change', () => { console.log(detector.userState, detector.screenState); });

五、核实API的可用性与运行状态

在实际部署前，必须通过代码主动检查API是否存在以及权限是否就绪。否则，环境缺失可能导致脚本中断或功能降级而无提示。

推荐做法如下：
1. 检查全局对象中是否存在IdleDetector构造函数：

if (!('IdleDetector' in window)) { /* 不支持，需准备降级方案 */ }

2. 调用permissions.query()获取当前权限状态，此方法比仅依赖requestPermission()返回值更可靠：

const status = await navigator.permissions.query({ name: 'idleDetection' });

3. 根据status.state的值（可能为'granted'、'denied'或'prompt'）决定是否启动检测器，或提示用户手动授权。