Was ist die Web API?

Die Web API (oder Browser API) ist eine Sammlung von Schnittstellen, die in modernen Webbrowsern integriert sind und es JavaScript ermöglichen, mit Browserfunktionen, Hardware und dem Betriebssystem zu interagieren. Beispiele sind die Fetch API für Netzwerkanfragen, die Geolocation API für GPS-Koordinaten, WebGL für 3D-Grafiken, die Clipboard API für Kopieren/Einfügen und hunderte weitere. Jede API wird durch Webstandards-Organisationen wie das W3C und WHATWG definiert, und Browserhersteller implementieren sie in ihrem eigenen Tempo.

Da die Browserunterstützung sehr unterschiedlich ausfällt – einige APIs sind universell unterstützt, andere sind experimentell oder herstellerspezifisch – müssen Entwickler häufig überprüfen, welche APIs in einem bestimmten Browser tatsächlich verfügbar sind, bevor sie sie verwenden. Feature Detection (Überprüfung, ob eine API auf window existiert, bevor sie aufgerufen wird) ist der Standardansatz.

Werkzeugbeschreibung

Dieses Tool testet in Echtzeit, welche Web APIs in Ihrem aktuellen Browser verfügbar sind. Es kombiniert Live-Browsererkennung mit Browserkompatibilitätsdaten von MDN, um Ihnen einen umfassenden Überblick darüber zu geben, welche APIs unterstützt werden, in welcher Version sie verfügbar wurden und ob einige noch experimentell sind.

Funktionen

  • Live-Erkennung: Testet jede API gegen das window-Objekt Ihres tatsächlichen Browsers und meldet sofort den Status „unterstützt", „nicht unterstützt" oder „unbekannt"
  • MDN-Kompatibilitätsdaten: Zeigt die Mindestversion von Chrome, Firefox, Safari und Edge an, die jede API unterstützt, aus dem offiziellen Paket @mdn/browser-compat-data
  • Kennzeichnung experimenteller APIs: Markiert deutlich APIs, die noch experimentell sind oder sich hinter Feature Flags befinden
  • Custom Expression Tester: Geben Sie einen beliebigen JavaScript-Ausdruck ein, um ihn live in Ihrem Browser auszuwerten und das Ergebnis oder einen Fehler anzuzeigen
  • Filterung und Suche: Filtern Sie nach Unterstützungsstatus (unterstützt/nicht unterstützt/unbekannt) und suchen Sie nach API-Namen, um schnell zu finden, was Sie benötigen

Funktionsweise

Das Tool lädt zur Build-Zeit eine Liste von Web API-Einträgen aus dem MDN Browser Compat Data-Paket. Wenn Sie die Seite öffnen, wird jeder API-Name als Eigenschaft des globalen window-Objekts ausgewertet – wenn die Eigenschaft existiert und nicht null ist, wird die API als unterstützt markiert. Die MDN-Versionsdaten werden vorab geladen und neben dem Live-Erkennungsergebnis angezeigt.

Tipps

  • Verwenden Sie den Statusfilter, um nur APIs anzuzeigen, die in Ihrem Browser unterstützt werden – nützlich, um zu überprüfen, was verfügbar ist, bevor Sie Code schreiben.
  • Verwenden Sie das Feld Custom Expression, um komplexere Feature Checks zu testen, z. B. typeof navigator.bluetooth !== 'undefined' oder 'serviceWorker' in navigator.
  • Experimentelle APIs können in einigen Browser-Builds verfügbar sein, aber nicht in stabilen Versionen – überprüfen Sie immer die MDN-Dokumentation, bevor Sie sich in der Produktion darauf verlassen.