GraphQL-Abfrage-Builder

Der GraphQL-Abfrage-Builder ist ein kostenloses Online-Tool, mit dem du GraphQL-Abfragen, -Mutationen und -Abonnements visuell erstellst, mit dynamischen Feldbäumen, Variablen, Fragmenten und Live-Ausgabe. Er läuft vollständig in deinem Browser, ohne Installation oder Anmeldung.

Query, Mutation und Subscription. Der Builder passt die Syntax je nach Operationstyp an.

Definiere typisierte Variablen ($userId: ID!) im Bereich Variablen und referenziere sie in den Argumenten. Fragmente definieren wiederverwendbare Feldauswahlen für einen Typ.

Ja, clientseitig, ohne Registrierung und ohne Server.

Absolut. Der GraphQL-Abfrage-Builder verarbeitet alles clientseitig in deinem Browser. Es werden keine Daten auf einen Server hochgeladen oder dort gespeichert. Deine Inhalte bleiben jederzeit privat auf deinem Gerät.

Ja, der GraphQL-Abfrage-Builder ist vollständig responsiv und funktioniert auf Smartphones und Tablets. Du kannst ihn auf jedem Gerät mit einem modernen Webbrowser nutzen, ganz ohne App-Download.

Es ist kein Konto und keine Registrierung erforderlich. Öffne einfach den GraphQL-Abfrage-Builder in deinem Browser und beginne sofort mit der Nutzung. Es gibt keine Anmeldeschranken oder Nutzungsbeschränkungen.

Der GraphQL-Abfrage-Builder unterstützt eine breite Palette beliebter Formate und Sprachen. In der Tool-Oberfläche findest du die vollständige Liste der unterstützten Optionen.

Gib einfach deine Eingabe in das vorgesehene Feld ein, passe die Einstellungen nach Wunsch an, und das Tool verarbeitet sie sofort. Anschließend kannst du das Ergebnis in die Zwischenablage kopieren oder herunterladen.

Der GraphQL-Abfrage-Builder funktioniert in allen modernen Browsern, darunter Chrome, Firefox, Safari, Edge und Opera. Für das beste Erlebnis verwende die neueste Version deines bevorzugten Browsers.

Eine Query liest Daten, ohne etwas zu verändern — sie fragt beim Server gezielt Felder ab und bekommt sie zurück, ähnlich wie ein GET-Request. Eine Mutation schreibt Daten: Sie erstellt, aktualisiert oder löscht Datensätze und gibt in der Regel das betroffene Objekt zurück, damit du die Änderung bestätigen kannst. Beide verwenden dieselbe Selection-Set-Syntax, um festzulegen, welche Felder zurückkommen, deklarieren aber unterschiedliche Operations-Schlüsselwörter (query versus mutation), und Mutationen benötigen fast immer Input-Argumente, oft eine typisierte Variable wie ein Input-Objekt. Daneben gibt es noch einen dritten Typ, subscription, der eine Verbindung für Echtzeit-Updates offenhält. In diesem Builder wählst du den Operationstyp vorab aus, und er passt das generierte Schlüsselwort und die Struktur entsprechend an, sodass du zwischen einer lesenden Query und einer schreibenden Mutation wechseln kannst, ohne die Umgebung von Hand neu zu schreiben.

Deklariere jede Eingabe als benannte Variable in der Operationssignatur, gib ihr einen GraphQL-Typ wie ID!, Int oder String, und referenziere sie dann innerhalb eines Arguments mit einem Dollarzeichen — zum Beispiel user(id: $userId). Werte separat als JSON-Objekt zu senden, hält die Query wiederverwendbar, ermöglicht deinem Client das Caching und vermeidet die Quoting- und Escaping-Fehler, die entstehen, wenn Rohwerte direkt in den String eingefügt werden. Das Ausrufezeichen nach einem Typ bedeutet, dass die Variable erforderlich ist. In diesem Builder werden deklarierte Variablen im Bereich Variables automatisch in die Signatur übernommen, und ein Wert, der innerhalb eines Arguments mit $ beginnt, wird automatisch als Variablenreferenz erkannt. Zusätzlich erzeugt der Builder ein direkt einfügbares Variables-JSON-Objekt neben der Query, sodass du beides sofort in Postman oder deinen API-Client übernehmen kannst.

Ein Fragment ist eine benannte, wiederverwendbare Menge von Feldern, die auf einem bestimmten Typ definiert wird — zum Beispiel fragment UserFields on User { id name email }. Statt dieselbe Feldauswahl an mehreren Stellen zu wiederholen, definierst du sie einmal und fügst sie überall ein, wo du diese Felder brauchst. Fragments halten große Queries lesbar, garantieren, dass zwei Teile einer Anfrage dieselbe Struktur abfragen, und erleichtern Schemaänderungen, weil du die Feldliste nur an einer Stelle bearbeitest. Besonders nützlich sind sie, wenn mehrere Queries denselben Objekttyp zurückgeben oder wenn eine UI-Komponente immer dieselben Eigenschaften benötigt. In diesem Builder fügst du ein Fragment hinzu, vergibst einen Namen und einen Zieltyp und baust seinen Feldbaum genauso auf wie die Hauptauswahl — die generierte Ausgabe enthält die Fragment-Definition, sodass sie sofort einsatzbereit ist.

GraphQL ist so konzipiert, dass der Client genau festlegt, welche Felder er möchte, und der Server nur diese zurückgibt — nicht mehr. Das ist das Gegenteil eines typischen REST-Endpunkts, der unabhängig davon, was du tatsächlich brauchst, immer eine feste Nutzlast sendet. Präzise Felder anzufragen bedeutet kleinere Antworten, weniger Over-Fetching von Daten, die du ohnehin verwirfst, und keine zusätzlichen Round-Trips, um verknüpfte Datensätze zu holen, da du Unterauswahlen verschachteln kannst, um verbundene Objekte in einer einzigen Anfrage abzuholen. Der Trade-off ist, dass jedes gewünschte Feld explizit im Selection Set genannt werden muss, was mit wachsender Query-Größe leicht auf subtile Weise falsch gemacht wird. Dieser Builder macht diese explizite Auswahl visuell — du klickst, um Felder beliebig tief hinzuzufügen und zu verschachteln, und er schreibt das passende Selection Set, sodass die Struktur genau die benötigte Datenform widerspiegelt.

Formatierte Ausgabe wird über mehrere Zeilen mit einheitlicher Einrückung dargestellt, sodass verschachtelte Selection Sets, Argumente und Fragments leicht zu lesen und zu überprüfen sind — das ist das Format, das du beim Commit einer Query in die Versionskontrolle oder beim Teilen mit Teamkollegen willst. Minifizierte Ausgabe komprimiert dieselbe Query auf eine einzige Zeile ohne überflüssige Leerzeichen, was praktisch ist, wenn du den Query-String direkt in Code oder einen Konfigurationswert einbettest, wo Zeilenumbrüche unpraktisch wären. Für den Server sind beide funktional identisch; nur die Leerzeichen unterscheiden sich, sodass du jederzeit zwischen beiden wechseln kannst, ohne das Verhalten zu ändern. In diesem Builder wechselt ein einzelner Schalter sofort zwischen den beiden Ansichten, und aus beiden heraus kannst du die Query kopieren, das Variables-JSON kopieren oder die Operation als .graphql-Datei herunterladen.