Softonic

Construtor de Consultas GraphQL

Etapa 1 / 2
Argumentos
Criar consulta

Escrever uma operação GraphQL manualmente significa manter chaves, argumentos e indentação em ordem. Este construtor monta o documento para você: escolha consulta, mutação ou assinatura, dê um nome à operação, defina o campo raiz, adicione argumentos e liste os campos necessários. O resultado é uma operação formatada pronta para colar no Apollo, urql ou GraphiQL.

Como construir uma operação GraphQL

  1. 1

    Escolha o tipo de operação

    Selecione consulta, mutação ou assinatura no menu suspenso. Isso define o tipo de operação que o servidor executa.

  2. 2

    Dê um nome à operação

    Dê um nome como GetUser para que o servidor possa registrar e armazenar em cache. O nome é opcional; o construtor funciona sem ele.

  3. 3

    Defina o campo raiz

    Digite o campo que deseja chamar, por exemplo user, createPost ou orderUpdated.

  4. 4

    Adicione argumentos

    Adicione pares chave-valor como id: "123" ou id: $id. Linhas com chave vazia são ignoradas.

  5. 5

    Liste os campos e copie

    Digite um campo por linha, construa a consulta e copie o documento formatado para a área de transferência.

Trabalhando com documentos GraphQL

Um documento GraphQL é um conjunto de uma ou mais operações mais quaisquer fragmentos que elas referenciam. Cada operação nomeia um campo raiz do tipo Query, Mutation ou Subscription, e o servidor resolve o conjunto de seleção que você solicita. O construtor escreve o texto da operação para você, mas não conhece o seu esquema, então confira cada nome de campo e de argumento com a sua API antes de executar a operação.

Anatomia da operação

Parte Propósito Exemplo
Tipo de operação Consulta, mutação ou assinatura query, mutation, subscription
Nome da operação Usado para cache e logs GetUserById
Argumentos Valores passados ao campo raiz user(id: "123")
Conjunto de seleção Campos e seleções aninhadas { user(id: "123") { name posts { title } } }
Variáveis Entradas tipadas declaradas com o nome da operação query GetUser($id: ID!) { user(id: $id) { name } }

Armadilhas comuns

  • Variáveis obrigatórias terminam com !. Esquecer isso em argumentos marcados como NonNull no esquema produz um erro de validação antes que o resolvedor seja executado.
  • Argumentos de texto precisam de aspas. Um valor como 123 é um número; um valor de texto deve ser escrito "123" com aspas duplas dentro da linha de argumento.
  • Tipos de união e interface requerem fragmentos inline ... on TypeName para ler campos específicos de tipo.
  • Alias é obrigatório quando você solicita o mesmo campo duas vezes com argumentos diferentes, por exemplo today: stats(period: DAY) e week: stats(period: WEEK).
  • Conexões (especificação Relay) expõem edges { node { ... } } e pageInfo { endCursor hasNextPage }; pular qualquer um deles quebra a paginação.

Dicas

  • Mantenha operações pequenas e nomeadas para que o Apollo Client possa armazená-las em cache individualmente.
  • Passe valores que mudam como variáveis em vez de literais, assim o servidor analisa o documento uma vez e o reutiliza; declare-as junto ao nome da operação, por exemplo query GetUser($id: ID!).
  • Se um campo precisar de vários argumentos, escreva-os em uma única linha de argumento separados por vírgulas, por exemplo filter: { status: ACTIVE } como valor.
  • O construtor emite exatamente o texto que você configurar. Se uma operação falhar, primeiro compare os nomes dos seus campos com o esquema atual.

Perguntas frequentes

Não. Ele apenas formata o texto que você fornece; não há endpoint para chamar nem esquema necessário. Preencha as partes da operação e o construtor monta o documento para você.

Sim. Use o menu suspenso de operação para alternar entre consulta, mutação e assinatura. Todo o resto funciona igual: nome, campo raiz, argumentos e campos.

Adicione linhas na seção de argumentos. A chave é o nome do argumento e o valor é o que você passa, por exemplo id: “123” ou id: $id. Linhas com chave vazia são ignoradas. Se você digitar uma variável como $id, declare-a você mesmo junto ao nome da operação, por exemplo query GetUser($id: ID!).

O construtor emite exatamente o texto que você digitou. O erro geralmente significa que um nome de campo ou de argumento não corresponde ao esquema do seu servidor: compare o campo raiz e cada nome de campo com a sua API e corrija a grafia.

Ferramentas relacionadas

Referência da Tabela ASCII

Tabela ASCII completa de 0 a 127 com valores decimais, hexadecimais, octais e binários e notação de referência numérica HTML, incluindo NUL, LF e DEL.

Referência de Caracteres HTML

Lista pesquisável de entidades HTML, seus códigos nomeados e numéricos, e uma cópia com um clique para caracteres e símbolos especiais.

Referência de atalhos de teclado

Pesquise atalhos padrão documentados do VS Code, Chrome e Bash com GNU Readline no macOS, Windows e Linux.

Gerador de EditorConfig

Gere um arquivo .editorconfig com suas regras de estilo e tamanho de indentação, fim de linha, charset e espaços em branco para formatação consistente entre IDEs e editores.

Validador de Email

Valide um endereço de email: verificação de sintaxe RFC 5322, consulta de registro MX em tempo real, além de detalhes de parte local, domínio e comprimento. Nenhum email é enviado.

Formatador de HTML

Formate HTML localmente no navegador com indentação de dois ou quatro espaços. O HTML não é enviado nem validado.

Ferramenta disponível em outros idiomas