EyeDropper API

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Sicherer Kontext: Diese Funktion ist nur in sicheren Kontexten (HTTPS) in einigen oder allen unterstützenden Browsern verfügbar.

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

Die EyeDropper-API bietet einen Mechanismus zur Erstellung eines Pipettenwerkzeugs. Mit diesem Werkzeug können Nutzer Farben von ihren Bildschirmen abtasten, einschließlich außerhalb des Browserfensters.

Konzept

Kreative Anwendungen erlauben es oft den Nutzern, Farben von Zeichnungen oder Formen in der Anwendung abzutasten, um sie wiederzuverwenden. Webanwendungen können die EyeDropper-API verwenden, um einen ähnlichen Pipettenmodus bereitzustellen, der vom Browser bereitgestellt wird.

Mit der API kann eine Webanwendung den Pipettenmodus starten. Sobald dieser gestartet ist, ändert sich der Cursor, um dem Nutzer anzuzeigen, dass der Modus aktiv ist. Der Nutzer kann dann entweder eine Farbe von überall auf dem Bildschirm auswählen oder den Pipettenmodus durch Drücken von Escape beenden.

Sicherheits- und Datenschutzmaßnahmen

Um zu verhindern, dass böswillige Websites Pixelinformationen vom Bildschirm eines Nutzers erhalten, ohne dass dieser es bemerkt, implementiert die EyeDropper-API folgende Maßnahmen:

  • Die API lässt den Pipettenmodus nicht ohne Nutzungsabsicht starten. Die Methode EyeDropper.open() kann nur als Reaktion auf eine Nutzeraktion (z. B. einen Klick auf einen Button) aufgerufen werden.
  • Es können keine Pixelinformationen ohne Nutzungsabsicht abgerufen werden. Das Promise, das von EyeDropper.open() zurückgegeben wird, wird nur in Bezug auf eine Nutzeraktion (Klicken auf einen Pixel) zu einem Farbwert aufgelöst. So kann die Pipette nicht im Hintergrund verwendet werden, ohne dass der Nutzer dies bemerkt.
  • Um den Nutzern zu helfen, den Pipettenmodus leichter zu bemerken, wird er von den Browsern deutlich kenntlich gemacht. Der normale Mauszeiger verschwindet nach kurzer Verzögerung, und eine Lupe erscheint stattdessen. Es gibt auch eine Verzögerung zwischen dem Start des Pipettenmodus und der Möglichkeit des Nutzers, einen Pixel auszuwählen, um sicherzustellen, dass der Nutzer Zeit hatte, die Lupe zu bemerken.
  • Nutzer können den Pipettenmodus auch jederzeit abbrechen (durch Drücken der Escape-Taste).

Schnittstellen

EyeDropper Experimentell

Die EyeDropper-Schnittstelle repräsentiert eine Instanz eines Pipettenwerkzeugs, das geöffnet und vom Nutzer verwendet werden kann, um Farben vom Bildschirm auszuwählen.

Spezifikationen

Specification
EyeDropper API
# eyedropper-interface

Browser-Kompatibilität

Siehe auch