Idle Detection API

Native Anwendungen und Browser-Erweiterungen nutzen die Leerlauferkennung, um Benutzererfahrungen darauf abzustimmen, wann ein Benutzer mit einem Gerät interagiert. Zum Beispiel können Chat-Anwendungen anderen Benutzern einer Anwendung anzeigen, ob jemand verfügbar ist. Andere Anwendungen könnten Benachrichtigungen nur anzeigen, wenn ein Benutzer mit der App interagiert. Eine Webanwendung könnte diese API für ähnliche Anwendungsfälle verwenden. Darüber hinaus könnte eine progressive Web-App die Leerlauferkennung nutzen, um ein Service-Worker-Update auszulösen, wenn die App nicht verwendet wird.

IdleDetector Experimentell

Bietet Methoden und Ereignisse zur Erkennung von Benutzeraktivitäten auf einem Gerät oder Bildschirm.

Das folgende Beispiel zeigt die Erstellung eines Detektors und das Protokollieren von Änderungen des Leerlaufstatus des Benutzers. Ein Button wird verwendet, um die notwendige Benutzeraktivierung zu erhalten, bevor die Erlaubnis angefordert wird.

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.");
});