Softonic

GraphQL-frågebyggare

Steg 1 / 2
Argument
Bygg fråga

Att skriva en GraphQL-operation för hand innebär att hålla ordning på klammerparenteser, argument och indrag. Den här byggaren sätter ihop dokumentet åt dig: välj fråga, mutation eller prenumeration, namnge operationen, ange rotfältet, lägg till argument och lista de fält du behöver. Resultatet är en formaterad operation som du kan klistra rakt in i Apollo, urql eller GraphiQL.

Så bygger du en GraphQL-operation

  1. 1

    Välj operationstyp

    Välj fråga, mutation eller prenumeration i listrutan. Det avgör vilken sorts operation servern kör.

  2. 2

    Namnge operationen

    Ge den ett namn som GetUser så att servern kan logga och cacha den. Namnet är valfritt; byggaren fungerar även utan.

  3. 3

    Ange rotfältet

    Skriv in det fält du vill anropa, till exempel user, createPost eller orderUpdated.

  4. 4

    Lägg till argument

    Lägg till nyckel-värdepar som id: "123" eller id: $id. Rader med tom nyckel hoppas över.

  5. 5

    Lista fälten och kopiera

    Skriv ett fält per rad, bygg frågan och kopiera det formaterade dokumentet till urklippet.

Att arbeta med GraphQL-dokument

Ett GraphQL-dokument är en uppsättning av en eller flera operationer plus eventuella fragment de refererar till. Varje operation namnger ett rotfält från typen Query, Mutation eller Subscription, och servern löser den urvalsmängd du begär. Byggaren skriver operationstexten åt dig, men den känner inte till ditt schema, så kontrollera varje fält- och argumentnamn mot ditt API innan du kör operationen.

En operations anatomi

Del Syfte Exempel
Operationstyp Fråga, mutation eller prenumeration query, mutation, subscription
Operationsnamn Används för cachning och loggar GetUserById
Argument Värden som skickas till rotfältet user(id: "123")
Urvalsmängd Fält och nästlade urval { user(id: "123") { name posts { title } } }
Variabler Typade indata som deklareras tillsammans med operationsnamnet query GetUser($id: ID!) { user(id: $id) { name } }

Vanliga fallgropar

  • Obligatoriska variabler slutar med !. Att glömma det på argument markerade NonNull i schemat ger ett valideringsfel innan resolvern körs.
  • Textargument behöver citattecken. Ett värde som 123 är ett tal; ett textvärde måste skrivas "123" med dubbla citattecken i argumentraden.
  • Union- och interfacetyper kräver ... on TypeName-inline-fragment för att läsa typspecifika fält.
  • Aliasering är obligatorisk när du begär samma fält två gånger med olika argument, till exempel today: stats(period: DAY) och week: stats(period: WEEK).
  • Anslutningar (Relay-spec) exponerar edges { node { ... } } och pageInfo { endCursor hasNextPage }; att hoppa över endera bryter paginering.

Tips

  • Håll operationer små och namngivna så att Apollo Client kan cacha dem individuellt.
  • Skicka värden som ändras som variabler i stället för literaler, så kan servern tolka dokumentet en gång och återanvända det. Deklarera dem bredvid operationsnamnet, till exempel query GetUser($id: ID!).
  • Om ett fält behöver flera argument skriver du dem i en enda argumentrad åtskilda av kommatecken, till exempel filter: { status: ACTIVE } som värde.
  • Byggaren matar ut exakt den text du konfigurerar. Misslyckas en operation, jämför först dina fältnamn med det aktuella schemat.

Vanliga frågor

Nej. Den formaterar bara texten du anger; det finns ingen endpoint att anropa och inget schema krävs. Fyll i operationens delar så sätter byggaren ihop dokumentet åt dig.

Ja. Använd listrutan för operation för att växla mellan fråga, mutation och prenumeration. Allt annat fungerar likadant: namn, rotfält, argument och fält.

Lägg till rader i avsnittet för argument. Nyckeln är argumentnamnet och värdet är det du skickar, till exempel id: “123” eller id: $id. Rader med tom nyckel ignoreras. Om du skriver en variabel som $id deklarerar du den själv bredvid operationsnamnet, till exempel query GetUser($id: ID!).

Byggaren matar ut exakt den text du skrivit. Felet brukar betyda att ett fält- eller argumentnamn inte stämmer med serverns schema: jämför rotfältet och varje fältnamn med ditt API och rätta stavningen.

Relaterade verktyg

ASCII-tabellreferens

Full ASCII-tabell från 0 till 127 med decimal-, hex-, oktal- och binärvärden samt notation för numeriska HTML-referenser, inklusive NUL, LF och DEL.

HTML-teckenreferens

En sökbar lista över HTML-entiteter med deras namngivna och numeriska koder samt kopiering med ett klick för specialtecken och symboler.

Referens för kortkommandon

Sök dokumenterade standardkommandon för VS Code, Chrome och Bash med GNU Readline i macOS, Windows och Linux.

HTML-formaterare

Formatera HTML lokalt i webbläsaren med indrag på två eller fyra blanksteg. HTML laddas inte upp eller valideras.

Slumpgenerator för bokstäver

Generera slumpade A-Z-bokstäver. Välj antal, versaler, gemener eller blandat läge och använd resultatet för spel, uppgifter eller klassrumsaktiviteter.

FPS-räknare

Mät webbläsarens FPS med requestAnimationFrame: utjämning, lägsta och högsta bildfrekvens, varningsgräns och valfri graf. Körs lokalt, utan uppladdning och utan API.

Verktyget finns på andra språk