Die Browser-Schnittstelle, die KI-Agenten verdienen.

AWI ist ein MCP-Server, der KI-Agenten eine kompakte, semantische Sicht auf jede Webseite gibt — statt 40.000 Bytes DOM, die sie nicht verarbeiten können.

  • Stabile Element-IDs
  • Token-effiziente Snapshots
  • Kein DOM-Rauschen
$npx agent-web-interface install
Auf GitHub ansehen
  • Open-Source
  • MIT-lizenziert
  • Funktioniert mit Claude, GPT-4o, Gemini, Ollama
  • Benötigt Node.js + Chrome

Das Problem

Browser-Automatisierung ist einfach für Skripte.

Schwierig für Agenten.

Aktuelle Tools kippen Tausende Tokens an Rauschen in den Kontext des Agenten. Aufgaben scheitern mittendrin. Selektoren brechen beim nächsten Deploy. Und es gibt keine stabile Möglichkeit, ein Element über mehrere Aufrufe hinweg zu referenzieren.

Vergleich der Browser-Ausgaben: Raw DOM und Accessibility Tree scheitern bei Agenten; Agent Web Interface gelingt es.

Raw DOM

<div class="wrapper xyz-123">
  <div class="inner" data-v="8">
    <button type="submit"
      class="btn btn-primary
      x-4 y-2 md:x-6">
      Submit
    </button>
  </div>
</div>

Über 40.000 Bytes Rauschen. Fragile Klassen-Selektoren. Kontext-Erschöpfung.

Accessibility Tree

RootWebArea "Checkout"
  generic ""
    generic "wrapper xyz-123"
      generic "inner"
        button "Submit"
          StaticText "Submit"

Besser, aber immer noch ausführlich. Keine stabilen IDs, um über Aufrufe hinweg zu referenzieren.

Agent Web Interface

<page title="Checkout">
  <region role="main">
    <button
      eid="btn-1"
      label="Submit" />
  </region>
</page>

Kompakt. Stabile eid. Nur das, was der Agent braucht.

Live-Beispiel

Sieh, was dein Agent sieht.

Jeder MCP-Tool-Aufruf liefert einen strukturierten semantischen Snapshot — kein Raw DOM.

agent-web-interface

input → tool call

{
  "tool": "navigate",
  "params": {
    "url": "https://example.com/checkout"
  }
}

output → snapshot

<page url="https://example.com/checkout"
      title="Checkout">
  <region role="main">
    <heading level="1">Your Cart (3 items)</heading>
    <list>
      <item eid="p1">Widget Pro — $29.99</item>
      <item eid="p2">Widget Lite — $9.99</item>
    </list>
    <button eid="btn-checkout"
            label="Proceed to Payment" />
  </region>
</page>

Der Agent referenziert btn-checkout über eid in jedem folgenden Aufruf — kein Selektor-Suchen, kein erneutes Finden von Elementen nach der Navigation.

So funktioniert es

Fünf Schritte. Ein Installationsbefehl.

1

Agent ruft ein Browser-Tool über MCP auf

navigate, click, find, type, screenshot…

2

AWI fängt den Tool-Aufruf ab

Ein lokaler Server, gestartet mit npx — kein Daemon zu verwalten

3

Puppeteer steuert Chrome

Lokales Chrome über CDP — echtes Rendering, volles JS

4

Seite auf semantisches XML reduziert

Überschriften, Schaltflächen, Links, Formulare — kein Raw Markup

5

Agent erhält stabile eids

Referenziere dieselbe Schaltfläche Aufruf für Aufruf. Kein erneutes Finden von Elementen.

AWI läuft lokal und benötigt Node.js und Chrome. Für serverlose oder geteilte Deployments siehe AWI Cloud.

Funktionen

Was Agenten bekommen, das Playwright nicht bietet.

Semantische Snapshots

Regionen, Überschriften, Links, Schaltflächen — keine Wand aus DOM. Agenten denken über Struktur nach, nicht über Markup.

Stabile Element-IDs

Jedes interaktive Element erhält eine stabile eid. Referenziere sie über 10 Tool-Aufrufe hinweg — CSS-Klassen ändern sich beim nächsten Deploy, die eid nicht.

Token-effizient

Snapshots liefern nur die Struktur, die ein Agent zum Handeln braucht — nicht die gesamte Seite bei jedem Aufruf. Längere Aufgaben-Horizonte. Geringerer Token-Verbrauch.

Netzwerk-Inspektion

Sieh jede Anfrage, die auf eine Aktion folgte — überprüfe Formularübermittlungen, verfolge Auth-Flows und debugge Weiterleitungen ohne DevTools-Tab.

Canvas-Inspektion

Wenn die Seite ein Canvas, Diagramm oder Bild ist, erstelle einen Screenshot oder lies Canvas-Daten direkt aus. Semantische Snapshots, wo sie funktionieren; Pixel, wo nicht.

Modell-agnostisch

Funktioniert mit jeder MCP-kompatiblen Agent-Laufzeit: Claude, GPT-4o, Gemini, lokale Modelle. Kein Vendor-Lock-in.

Was Menschen bauen

Agenten, die im echten Web handeln.

Web-Recherche-Agenten

Navigiere, lies und extrahiere aus echten Seiten — Preis-Monitore, Nachrichten-Aggregatoren und Wettbewerbs-Tracker, die mit echten gerenderten Inhalten arbeiten, nicht mit veralteten APIs.

QA & Flow-Automatisierung

Durchlaufe Anmelde-, Checkout- und Onboarding-Flows. Fülle Formulare aus, verifiziere Antworten — ohne die fragilen CSS-Selektoren, die Playwright-Suites brechen.

Dateneingabe & Formularausfüllung

Melde dich an, finde Felder anhand ihres Labels und sende ab — selbst auf Seiten, deren DOM sich zwischen Besuchen verschiebt.

Managed Cloud

Du willst Chrome nicht verwalten?

AWI Cloud betreibt Headless-Chrome für dich. Verbinde dich in Sekunden per API-Schlüssel, teile Sessions im Team und zahle nur für die genutzte Browser-Zeit.

  • Kein lokales Chrome oder Node.js zu installieren — nur ein API-Schlüssel
  • Teile Browser-Sessions und Zugangsdaten im Team
  • Zahle pro Minute — keine Platzgebühren, keine Verpflichtungen
  • Starte kostenlos, erweitere beim Skalieren

FAQ

Fragen, die Agenten (und ihre Entwickler) stellen.

Was ist Agent Web Interface (AWI)?

AWI ist ein quelloffener MCP-Server, der KI-Agenten eine kompakte, semantische Sicht auf jede Webseite gibt. Statt rohem DOM oder ausführlichen Accessibility-Bäumen liefert er strukturierte XML-Snapshots mit stabilen Element-IDs (eids), auf die Agenten über mehrere Tool-Aufrufe hinweg verweisen können.

Wie unterscheidet sich AWI von Playwright- oder Puppeteer-MCP-Servern?

Playwright und Puppeteer wurden für deterministische Skripte gebaut, daher übergeben ihre MCP-Wrapper dem Agenten rohes DOM oder lange Accessibility-Dumps, die seinen Kontext überfluten. AWI liefert nur die semantische Struktur, die ein Agent braucht — Überschriften, Buttons, Links, Formulare — mit stabilen eids, sodass Aufgaben länger und mit weit weniger Tokens laufen.

Wie reduziert AWI den Token-Verbrauch?

Eine typische Seite hat über 40.000 Bytes DOM. AWI reduziert sie auf einen kompakten Snapshot — oft unter 1 KB — der nur die interaktiven und strukturellen Elemente enthält, die ein Agent zum Handeln braucht. Das bedeutet weniger Tokens pro Schritt und längere mehrstufige Aufgaben, bevor der Kontext voll ist.

Mit welchen KI-Modellen und Agenten funktioniert AWI?

Mit jeder MCP-kompatiblen Laufzeit — Claude, GPT-4o, Gemini und lokalen Modellen über Ollama. AWI spricht das Model Context Protocol direkt, es gibt also keinen modellspezifischen Glue-Code und keine Herstellerbindung.

Ist AWI kostenlos und quelloffen?

Ja. AWI ist MIT-lizenziert und wird offen auf GitHub entwickelt, du kannst es also kostenlos selbst hosten. Für Teams, die Chrome nicht selbst betreiben möchten, gibt es eine verwaltete AWI Cloud.

Muss ich einen Browser lokal ausführen?

Der lokale Server steuert eine echte Chrome-Instanz über Puppeteer, du brauchst also Node.js und Chrome. Wenn du das nicht selbst verwalten möchtest, betreibt AWI Cloud headless Chrome für dich hinter einem API-Schlüssel.

Loslegen

Ein Befehl. Agenten surfen.

$npx agent-web-interface install

Open-Source · MIT-lizenziert · Funktioniert mit Claude, GPT-4o, Gemini und jedem MCP-kompatiblen Agenten.