Softonic

Costruttore di Query GraphQL

Passaggio 1 / 2
Argomenti
Crea query

Scrivere un’operazione GraphQL a mano significa tenere in ordine parentesi graffe, argomenti e indentazione. Questo costruttore assembla il documento al posto tuo: scegli query, mutazione o sottoscrizione, dai un nome all’operazione, imposta il campo radice, aggiungi gli argomenti ed elenca i campi che ti servono. Ottieni un’operazione formattata da incollare direttamente in Apollo, urql o GraphiQL.

Come costruire un'operazione GraphQL

  1. 1

    Scegli il tipo di operazione

    Seleziona query, mutazione o sottoscrizione dal menu a tendina. Questo definisce il tipo di operazione che il server esegue.

  2. 2

    Dai un nome all'operazione

    Assegna un nome come GetUser in modo che il server possa registrarla e memorizzarla nella cache. Il nome è facoltativo; il costruttore funziona anche senza.

  3. 3

    Imposta il campo radice

    Digita il campo che vuoi chiamare, ad esempio user, createPost o orderUpdated.

  4. 4

    Aggiungi gli argomenti

    Aggiungi coppie chiave-valore come id: "123" o id: $id. Le righe con chiave vuota vengono saltate.

  5. 5

    Elenca i campi e copia

    Digita un campo per riga, genera la query e copia il documento formattato negli appunti.

Lavorare con documenti GraphQL

Un documento GraphQL è un insieme di una o più operazioni più eventuali frammenti a cui fanno riferimento. Ogni operazione nomina un campo radice dal tipo Query, Mutation o Subscription, e il server risolve il set di selezione che richiedi. Il costruttore scrive il testo dell’operazione al posto tuo, ma non conosce il tuo schema: verifica quindi ogni nome di campo e di argomento contro la tua API prima di eseguire l’operazione.

Anatomia dell’operazione

Parte Scopo Esempio
Tipo di operazione Query, mutazione o sottoscrizione query, mutation, subscription
Nome dell’operazione Usato per caching e log GetUserById
Argomenti Valori passati al campo radice user(id: "123")
Set di selezione Campi e selezioni annidate { user(id: "123") { name posts { title } } }
Variabili Input tipizzati dichiarati insieme al nome dell’operazione query GetUser($id: ID!) { user(id: $id) { name } }

Errori comuni

  • Le variabili richieste terminano con !. Dimenticarlo su argomenti contrassegnati come NonNull nello schema produce un errore di validazione prima che il risolutore venga eseguito.
  • Gli argomenti di testo richiedono le virgolette. Un valore come 123 è un numero; un valore di testo va scritto "123" con le virgolette doppie nella riga dell’argomento.
  • I tipi di unione e interfaccia richiedono frammenti inline ... on TypeName per leggere campi specifici del tipo.
  • L’alias è obbligatorio quando richiedi lo stesso campo due volte con argomenti diversi, ad esempio today: stats(period: DAY) e week: stats(period: WEEK).
  • Le connessioni (specifica Relay) espongono edges { node { ... } } e pageInfo { endCursor hasNextPage }; saltare uno dei due interrompe la paginazione.

Suggerimenti

  • Mantieni le operazioni piccole e nominate affinché Apollo Client possa memorizzarle nella cache singolarmente.
  • Passa i valori che cambiano come variabili invece che come letterali, così il server analizza il documento una volta e lo riutilizza; dichiarale insieme al nome dell’operazione, ad esempio query GetUser($id: ID!).
  • Se un campo richiede più argomenti, scrivili in un’unica riga di argomento separati da virgole, ad esempio filter: { status: ACTIVE } come valore.
  • Il costruttore emette esattamente il testo che configuri. Se un’operazione fallisce, confronta prima i nomi dei tuoi campi con lo schema attuale.

Domande frequenti

No. Formatta solo il testo che fornisci; non c’è alcun endpoint da chiamare e non serve alcuno schema. Compila le parti dell’operazione e il costruttore assembla il documento al posto tuo.

Sì. Usa il menu a tendina dell’operazione per passare da query a mutazione o sottoscrizione. Tutto il resto funziona allo stesso modo: nome, campo radice, argomenti e campi.

Aggiungi righe nella sezione degli argomenti. La chiave è il nome dell’argomento e il valore è ciò che passi, ad esempio id: “123” o id: $id. Le righe con chiave vuota vengono ignorate. Se digiti una variabile come $id, dichiarala tu stesso insieme al nome dell’operazione, ad esempio query GetUser($id: ID!).

Il costruttore emette esattamente il testo che hai digitato. L’errore di solito significa che un nome di campo o di argomento non corrisponde allo schema del tuo server: confronta il campo radice e ogni nome di campo con la tua API e correggi l’ortografia.

Strumenti correlati

Riferimento Tabella ASCII

Tabella ASCII completa da 0 a 127 con decimale, esadecimale, ottale, binario e riferimento numerico HTML per ogni carattere, inclusi i codici di controllo come NUL, LF e DEL.

Riferimento ai caratteri HTML

Elenco ricercabile delle entità HTML, dei loro codici nominati e numerici, e copia con un clic per caratteri e simboli speciali.

Generatore di lettere casuali

Genera lettere A-Z casuali. Scegli la quantità, usa maiuscole, minuscole o un mix, e applica il risultato a giochi, spunti o attività in classe.

Riferimento scorciatoie da tastiera

Cerca le scorciatoie predefinite documentate di VS Code, Chrome e Bash con GNU Readline su macOS, Windows e Linux.

Trova nome colore

Trova il colore CSS standard con nome più vicino a un valore HEX, RGB o HSL usando la differenza CIEDE2000.

Formatter HTML

Formatta HTML localmente nel browser con rientri di due o quattro spazi. L’HTML non viene caricato né validato.

Strumento disponibile in altre lingue