Start · Sprachen · JavaScript · Referenz · Keyboard.unlock()

Keyboard.unlock()

Methode

Gibt alle Tasten wieder frei, die zuvor mit <code>navigator.keyboard.lock()</code> gesperrt wurden. Die Methode arbeitet synchron.

seit JavaScript Experimentell: Chromium 68+ (Chrome, Edge, Opera); Kategorie: webapi

Signatur

Keyboard.prototype.unlock()

Beschreibung

Die Methode unlock() gehört zur Keyboard Lock API und hebt eine Tastatursperre auf, die vorher mit navigator.keyboard.lock() eingerichtet wurde. Danach verarbeiten Browser und Betriebssystem Tasten wie Escape, Alt+Tab, Meta oder F11 wieder selbst und geben sie nicht mehr an die Seite weiter.

Gebraucht wird die Methode vor allem bei Anwendungen im Vollbildmodus, die Systemtasten abfangen müssen. Beispiele sind Remote-Desktop-Clients, Cloud-Gaming, Browser-Spiele oder virtuelle Maschinen. Rufe unlock() auf, sobald die Anwendung die Tasten nicht mehr braucht, zum Beispiel wenn die Person den Vollbildmodus beendet, ein Spiel pausiert oder eine Sitzung trennt.

Anders als lock() gibt unlock() kein Promise zurück. Die Freigabe geschieht sofort und synchron. Die Methode hebt immer alle gesperrten Tasten auf, einzelne Tasten lassen sich nicht gezielt freigeben. Brauchst du eine kleinere Auswahl, rufst du lock() einfach erneut mit der neuen Tastenliste auf. Ein erneuter Aufruf ersetzt die vorherige Sperre.

Beispiele

Sperre einrichten und wieder aufheben

const lockKeys = async () => {
  if (!('keyboard' in navigator) || !navigator.keyboard.lock) {
    console.log('Keyboard Lock API nicht verfügbar');
    return;
  }
  await document.documentElement.requestFullscreen();
  await navigator.keyboard.lock(['Escape', 'KeyW', 'MetaLeft']);
  console.log('Tasten gesperrt');
};

const unlockKeys = () => {
  navigator.keyboard?.unlock();
  console.log('Tasten freigegeben');
};

document.querySelector('#start').addEventListener('click', lockKeys);
document.querySelector('#stop').addEventListener('click', unlockKeys);
Tasten gesperrt Tasten freigegeben

Automatisch freigeben beim Verlassen des Vollbildmodus

document.addEventListener('fullscreenchange', () => {
  if (!document.fullscreenElement) {
    // Vollbild beendet – Systemtasten wieder an Browser/OS zurückgeben
    navigator.keyboard?.unlock();
    console.log('Vollbild verlassen, Tastatursperre aufgehoben');
  }
});
Vollbild verlassen, Tastatursperre aufgehoben

Spiel pausieren: Sperre aufheben, beim Fortsetzen erneut sperren

const GAME_KEYS = ['KeyW', 'KeyA', 'KeyS', 'KeyD', 'Escape'];
let paused = false;

const togglePause = async () => {
  paused = !paused;
  if (paused) {
    navigator.keyboard.unlock();
    console.log('Pausiert – Tasten frei');
  } else {
    await navigator.keyboard.lock(GAME_KEYS);
    console.log('Weiter – Tasten gesperrt');
  }
};

document.querySelector('#pause').addEventListener('click', togglePause);
Pausiert – Tasten frei Weiter – Tasten gesperrt

// Wichtig · Fallstricke

  • Browser-Unterstützung: Die API ist experimentell und nur in Chromium-Browsern verfügbar (Chrome, Edge und Opera ab Version 68). Firefox und Safari unterstützen sie nicht. Prüfe deshalb vor dem Aufruf, ob sie vorhanden ist, zum Beispiel mit navigator.keyboard?.unlock().
  • Die API funktioniert nur in einem sicheren Kontext (HTTPS). In iframes ist sie nur erlaubt, wenn die Richtlinie keyboard-lock dies zulässt.
  • Wurden vorher keine Tasten gesperrt, ist unlock() harmlos und bewirkt nichts. Es wird keine Ausnahme ausgelöst.
  • Einzelne Tasten lassen sich nicht gezielt freigeben. Es werden immer alle Sperren aufgehoben.
  • Ist die Sperre aktiv, kann die Person den Vollbildmodus trotzdem beenden, indem sie Escape gedrückt hält. Der Browser hebt die Sperre auch selbst auf, wenn das Dokument den Fokus oder den Vollbildmodus verliert. Rufe unlock() trotzdem ausdrücklich auf, damit der Zustand deiner Anwendung stimmig bleibt.
  • Aus Gründen der Barrierefreiheit und des Vertrauens gilt: Sperre Tasten nur so lange wie nötig und gib sie schnell wieder frei.