Zum Inhalt springen
BeispielWerk
English

GraphQL Beispiele: Query, Mutation, Subscription

GraphQL ist eine Abfragesprache für Schnittstellen, bei der der Client genau die gewünschten Felder anfordert. Die Seite zeigt Queries mit Variablen, die Anfrage als JSON-Body, Antworten mit data und errors, eine Mutation samt Variablen, eine Subscription und ein Fragment. Typen und Felder wie Kunde und Rechnung sind frei gewählt.

13 Varianten auf einer Seite, jede mit eigenem Kopier- oder Download-Knopf.

  • GraphQL-Abfrage mit Variable

    query KundeHolen($id: ID!) {
      kunde(id: $id) {
        id …

    Benannte Query mit Variable $id und verschachtelter Auswahl.

  • GraphQL-Anfrage als JSON-Body

    {"query":"query KundeHolen($id: ID!) {\n  kunde(id: $id) {\n    id\n    name\n    rechnungen(first: 2) {\n      nummer\n      betragCent\n    }\n  }\n}","variables":{"id":"K-000001"},"operationName":"KundeHolen"}

    POST mit Content-Type application/json; Felder query, variables, operationName.

  • GraphQL-Antwort

    {
      "data": {
        "kunde": { …

    Antwort enthält data (und ggf. errors).

  • GraphQL-Antwort mit Fehler

    {
      "errors": [
        { …

    Üblich: HTTP 200 mit errors-Liste; Felder message, locations, path, extensions.

  • GraphQL-Mutation

    mutation RechnungAnlegen($eingabe: RechnungEingabe!) {
      rechnungAnlegen(eingabe: $eingabe) {
        nummer …

    Schreibzugriff über mutation.

  • Variablen zur Mutation

    {
      "eingabe": {
        "kundeId": "K-000001", …

    JSON für das Feld variables.

  • GraphQL-Subscription

    subscription {
      rechnungBezahlt {
        nummer …

    Push-Ereignisse, meist über WebSocket.

  • GraphQL mit Fragment

    fragment KundeFelder on Kunde {
      id
      name …

    Wiederverwendbare Feldauswahl.

  • GraphQL mit Alias

    query {
      erster: kunde(id: "K-000001") { name }
      zweiter: kunde(id: "K-000002") { name } …

    Alias erlaubt dasselbe Feld mehrfach.

  • GraphQL: __typename

    { __typename }

    Kleinste gültige Abfrage; funktioniert bei jedem Server.

  • GraphQL-Introspektion, Typnamen

    {
      __schema {
        types { …

    Listet Typen; in Produktion oft deaktiviert.

  • GraphQL-Schema (SDL)

    type Kunde {
      id: ID!
      name: String! …

    Schema Definition Language.

  • GraphQL per GET

    GET /graphql?query=%7B__typename%7D HTTP/1.1

    URL-kodierte Query { __typename }; GET ist nur für Abfragen zulässig.

Weitere Themen in Web & API