Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.

View in English Always switch to English

Keyboard API

Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.

Die Keyboard API bietet Methoden zur Arbeit mit einer physischen Tastatur, die an ein Gerät angeschlossen ist, auf dem ein Browser läuft.

Sie bietet mehrere Funktionen. Tastaturzuordnung bietet eine Schnittstelle zum Abrufen des von einer bestimmten physischen Taste auf einer Tastatur erzeugten Strings, um diese Taste dem Benutzer korrekt zu identifizieren. Tastatursperre ermöglicht es einer Webseite, Tasten zu erfassen, die normalerweise vom Benutzeragenten oder dem zugrunde liegenden Betriebssystem reserviert sind. Die beabsichtigte Nutzung der Keyboard API erfolgt durch Webanwendungen wie Spiele oder Remotezugriffs-Apps, die ein Vollbild-Erlebnis bieten.

Konzepte und Nutzung

Tastaturzuordnung

Auf physischen Tastaturen enthält das code-Attribut die physische Position der gedrückten Taste, und das key-Attribut enthält den durch Drücken der Taste an dieser physischen Position auf der Tastatur erzeugten String. Der key-Wert berücksichtigt die Sprachregion der Tastatur (zum Beispiel 'en-US'), das Layout (zum Beispiel 'QWERTY') und den Zustand der Modifier-Taste (Shift, Control usw.). Historisch gesehen gab es keine Möglichkeit, diese Informationen abzurufen.

Die Keyboard Map API bietet eine Möglichkeit, den durch einen bestimmten Tastendruck erzeugten String abzurufen, über die Keyboard-Schnittstelle und die KeyboardLayoutMap-Schnittstelle. Auf die Keyboard-Schnittstelle wird über navigator.keyboard zugegriffen. Keyboard bietet die Methode Keyboard.getLayoutMap, die ein Versprechen zurückgibt, das mit einem KeyboardLayoutMap-Objekt aufgelöst wird, das Mitglieder zur Umwandlung von Codes in Tasten enthält. Eine Liste gültiger Code-Werte findet sich im Abschnitt Writing System Keys der UI Events KeyboardEvent code Values Spezifikation.

Das folgende Beispiel zeigt, wie man den orts- oder layout-spezifischen String erhält, der mit der Taste W auf einer englischen QWERTY-Tastatur verknüpft ist.

js
if (navigator.keyboard) {
  const keyboard = navigator.keyboard;
  keyboard.getLayoutMap().then((keyboardLayoutMap) => {
    const upKey = keyboardLayoutMap.get("KeyW");
    window.alert(`Press ${upKey} to move up.`);
  });
} else {
  // Do something else.
}

Tastatursperre

Interaktive Webseiten, Spiele und Remote-Streaming-Erlebnisse erfordern oft den Zugriff auf spezielle Tasten und Tastenkombinationen im Vollbildmodus. Beispiele für solche Tasten/Tastenkombinationen sind Escape, Alt+Tab und Ctrl+N. Diese Tasten und Tastenkombinationen werden typischerweise vom Benutzeragenten oder vom zugrunde liegenden Betriebssystem erfasst, wie im folgenden Beispiel gezeigt.

Um die Tasten W, A, S und D zu erfassen, rufen Sie lock() mit einer Liste auf, die den Wert des code-Attributs für jede dieser Tasten enthält:

js
navigator.keyboard.lock(["KeyW", "KeyA", "KeyS", "KeyD"]);

Dies erfasst diese Tasten unabhängig davon, welche Modifier bei der Tastenbetätigung verwendet werden. Unter Annahme eines standardmäßigen US-amerikanischen QWERTY-Layouts stellt das Registrieren von KeyW sicher, dass W, Shift+W, Control+W, Control+Shift+W und alle anderen Tastenmodifikator-Kombinationen mit W an die App gesendet werden. Gleiches gilt für KeyA, KeyS und KeyD.

Schriftsystemtasten

Die an Keyboard.lock und die verschiedenen Methoden der KeyboardLayoutMap-Schnittstelle übergebenen Codes werden als "Schriftsystemtasten" bezeichnet.

"Schriftsystemtasten" werden im Abschnitt Writing System Keys der UI Events KeyboardEvent code Values Spezifikation definiert, da die physischen Tasten ihre Bedeutung je nach aktueller Sprachregion und Tastaturlayout ändern. Diese Tasten werden unten gezeigt. Blaue Tasten sind auf allen Standardtastaturen vorhanden, während grüne Tasten nur auf einigen Tastaturen verfügbar sind.

Schriftsystemtasten, wie sie von der UI Events KeyboardEvent code Values Spezifikation definiert sind.

Schnittstellen

Keyboard Experimentell

Bietet Funktionen, die Tastaturlayout-Karten abrufen und das Erfassen von Tastendrücken von der physischen Tastatur umschalten.

KeyboardLayoutMap Experimentell

Ein map-ähnliches Objekt mit Funktionen zum Abrufen des Strings, der mit bestimmten physischen Tasten verknüpft ist.

Erweiterungen zu anderen Schnittstellen

Gibt ein Keyboard-Objekt zurück, das Zugriff auf Funktionen bietet, die Tastaturlayout-Karten abrufen und das Erfassen von Tastendrücken von der physischen Tastatur umschalten.

Spezifikationen

Specification
Keyboard Lock
Keyboard Map

Browser-Kompatibilität

api.Keyboard

api.KeyboardLayoutMap