Uso do GraphiQL IDE graphiql-ide
Uma implementação do padrão GraphiQL IDE está disponível para uso com a API do GraphQL do Adobe Experience Manager (AEM).
A ferramenta GraphiQL permite testar e depurar as consultas do GraphQL, permitindo:
- selecionar o endpoint apropriado à configuração de Sites que deseja usar para as consultas
- inserir diretamente novas consultas
- criar e acessar consultas persistentes
- executar as consultas para ver os resultados imediatamente
- gerenciar variáveis de consulta
- salvar e gerenciar consultas persistentes
- publicar ou desfazer a publicação de consultas persistentes (por exemplo, para/do
dev-publish
) - consultar o histórico de consultas anteriores
- usar o Explorador de documentação para acessar a documentação; ajudando você a conhecer e entender quais métodos estão disponíveis.
É possível acessar o editor de consultas por meio de:
- Ferramentas > Geral > Editor de Consultas do GraphQL
- diretamente; por exemplo,
http://localhost:4502/aem/graphiql.html
Você pode usar o GraphiQL no sistema para que as consultas possam ser solicitadas pelo aplicativo cliente usando solicitações GET e para publicar consultas. Para o uso em produção, é possível mover as consultas para o ambiente de produção. Inicialmente ao autor de produção para validação do conteúdo recém-criado com as consultas e, finalmente, à produção de publicação para consumo em tempo real.
Seleção do endpoint selecting-endpoint
Como primeira etapa, é preciso selecionar o endpoint que deseja usar para as consultas. O endpoint é apropriado para a configuração dos Sites que você deseja usar para as consultas.
Isso está disponível na lista suspensa na parte superior direita.
Criação e persistência de uma nova consulta creating-new-query
Você pode inserir a nova consulta no editor, que está no painel central esquerdo, diretamente sob o logotipo do GraphiQL.
+
(ao lado de Consultas persistentes) para esvaziar o editor para sua nova consulta.Basta começar a digitar. O editor também:
- mostra informações adicionais sobre os elementos ao passar o mouse sobre eles
- fornece recursos como realce de sintaxe, preenchimento automático, sugestão automática
{
.#
são ignoradas.Use a opção Salvar como para criar uma consulta persistente.
Atualização da consulta persistente updating-persisted-query
Selecione a consulta que deseja atualizar na lista do painel Consultas persistentes (lado esquerdo).
A consulta será exibida no painel do editor. Faça as alterações necessárias e use a opção Salvar para confirmar as atualizações da consulta persistente.
Execução de consultas running-queries
Você pode executar uma nova consulta imediatamente ou pode carregar e executar uma consulta persistente. Para carregar uma consulta persistente, selecione-a na lista; a consulta será exibida no painel do editor.
Em ambos os casos, a consulta exibida no painel do editor é a que será executada quando você:
- clique no ícone Executar Consulta
- usar a combinação de teclado
Control-Enter
Variáveis de consulta query-variables
O GraphiQL IDE também permite gerenciar suas Variáveis de consulta.
Por exemplo:
Publicação de consultas persistentes publishing-persisted-queries
Depois de selecionar sua consulta persistente na lista (painel esquerdo), você pode usar as ações Publish e Cancelar publicação. Isso as ativará no ambiente de publicação (por exemplo, dev-publish
) para facilitar o acesso de seus aplicativos durante os testes.
Time To Live
{"cache-control":"parameter":value} tem um valor padrão de 2 horas (7200 segundos).Copiar o URL para acessar a consulta diretamente copy-url
A opção Copiar URL permite simular uma consulta copiando a URL usada para acessar diretamente a consulta persistente e ver os resultados. Essa opção pode ser usada para testes; por exemplo, acessando em um navegador:
Por exemplo:
http://localhost:4502/graphql/execute.json/global/article-list-01
Ao usar esse URL em um navegador, é possível confirmar os resultados:
A opção Copiar URL é acessível por meio dos três pontos verticais à direita do nome da consulta persistente (painel à esquerda):
Exclusão de consultas persistentes deleting-persisted-queries
A opção Excluir também é acessível por meio dos três pontos verticais à direita do nome da consulta persistente (painel à esquerda).
Instalação da consulta persistente na produção installing-persisted-query-production
Depois de desenvolver e testar a consulta persistente com o GraphiQL, o objetivo final é transferi-la para o ambiente de produção para que os aplicativos possam usá-la.
Atalhos de teclado keyboard-shortcuts
Há uma série de atalhos de teclado que fornecem acesso direto aos ícones de ação no IDE:
- Adornar a consulta:
Shift-Control-P
- Mesclar consulta:
Shift-Control-M
- Executar consulta:
Control-Enter
- Preenchimento automático:
Control-Space
Control
é rotulada como Ctrl
.