空闲检测 API

可用性有限

此功能不是基线功能,因为它在一些使用最广泛的浏览器中不起作用。

安全上下文:此功能仅在安全上下文(HTTPS)中可用,在部分或全部支持的浏览器中可用。

实验性:这是一个实验性技术
在生产环境中使用之前,请仔细查看浏览器兼容性表

空闲检测 API 提供了一种检测用户空闲状态(具体来说,活动、空闲和锁定)的方法,并且可以在脚本无需轮询的情况下收到空闲状态更改的通知。

概念和用法

原生应用程序和浏览器扩展使用空闲检测来基于用户何时与设备交互的用户体验。例如,聊天应用程序可以向应用程序的其他用户显示某人是否可用。其他应用程序可能会选择仅在用户与应用程序交互时显示通知。Web 应用程序可以使用此 API 实现类似的用例。此外,渐进式 Web 应用可以使用空闲检测在应用程序未使用时触发服务工作线程更新。

接口

IdleDetector 实验性

提供用于检测设备或屏幕上用户活动的方法和事件。

示例

以下示例演示了如何创建检测器并记录用户空闲状态的更改。在请求权限之前,将使用一个按钮获取必要的用户激活。

js
const controller = new AbortController();
const signal = controller.signal;

startButton.addEventListener("click", async () => {
  if ((await IdleDetector.requestPermission()) !== "granted") {
    console.error("Idle detection permission denied.");
    return;
  }

  try {
    const idleDetector = new IdleDetector();
    idleDetector.addEventListener("change", () => {
      const userState = idleDetector.userState;
      const screenState = idleDetector.screenState;
      console.log(`Idle change: ${userState}, ${screenState}.`);
    });

    await idleDetector.start({
      threshold: 60_000,
      signal,
    });
    console.log("IdleDetector is active.");
  } catch (err) {
    // Deal with initialization errors like permission denied,
    // running outside of top-level frame, etc.
    console.error(err.name, err.message);
  }
});

stopButton.addEventListener("click", () => {
  controller.abort();
  console.log("IdleDetector is stopped.");
});

规范

规范
空闲检测 API
# api-idledetector

浏览器兼容性

BCD 表仅在启用 JavaScript 的浏览器中加载。