Envelop é uma biblioteca de plug-in GraphQL leve que permite adicionar recursos personalizados para sua camada de execução GraphQL, independentemente do servidor GraphQL que você usa.
Servidores GraphQL como Apollo GraphQL e Graphite já tem sistemas de plugins específicos para plataformas que funcionam bem. A desvantagem é que se você escolher mudar para uma implementação diferente do GraphQL por qualquer motivo, você precisará modificar o plug-in para trabalhar com essa implementação específica.
O que é Envelop?
É aí que entra o Envelop. Envelop não é um servidor GraphQL-é um wrapper no GraphQL que permite aos desenvolvedores escrever plug-ins independentes de plataforma. Isso significa que você só precisa escrever seu plug-in uma vez para que funcione com o Envelop e se integre a qualquer servidor GraphQL.
Para aprender como fazer isso, vamos integrar o Envelop com Fastify e Apollo GraphQL.
Aqui está o que você precisa para acompanhar este tutorial:
Node.js 10.15.1+ Uma compreensão básica do Node
Configurando o aplicativo Node
Execute o seguinte comando para instalar todas as dependências de que precisaremos:
npm install @ envelop/core fastify graphql graphql-helix–save
A seguir, precisamos criar um servidor. Crie um arquivo server.js e adicione o seguinte código:
const {envelop, useSchema, useLogger}=require (‘@ envelop/core’); const fastify=require (‘fastify’); const {processRequest, getGraphQLParameters}=require (‘graphql-helix’);
No código acima, estamos importando envelope e seus plug-ins. Se você usou React Hooks, a convenção de nomenclatura para os plug-ins será familiar para você. Os plug-ins de envelope são nomeados com um prefixo e a palavra-chave use. Neste exemplo, adicionaremos o plug-in useSchema e o plug-in useLogger.
Para começar, usaremos o destino GraphQL Helix para construir nosso servidor GraphQL para capturar e processar solicitações para o Fastify servidor.
Criando um esquema GraphQL
A seguir, criaremos um arquivo schema.js, onde definiremos nossos tipos de esquema, mutações e resolvedores para que possamos crie uma biblioteca de canções. Este arquivo deve ter o seguinte conteúdo:
const {GraphQLObjectType, GraphQLSchema, GraphQLString,}=require (“graphql”); esquema const=new GraphQLSchema ({mutation: new GraphQLObjectType ({name:”Mutation”, fields: ()=> ({echo: {args: {text: {type: GraphQLString,},}, type: GraphQLString, resolve: (_root, args)=> {return args.text;},},}),}), query: new GraphQLObjectType ({name:”Query”, fields: ()=> ({song: {type: new GraphQLObjectType ({nome:”Song”, fields: ()=> ({firstVerse: {type: GraphQLString, resolve: ()=>”Cantando uma música para mim é adorável.”,}, secondVerse: {type: GraphQLString, resolve: ()=> new Promise ((resolve)=> setTimeout (()=> resolve (“Você nunca quis cantar comigo?”), 5000)),},}),}), resolve: ()=> ({}),},}) ,}),}); module.exports=schema
Criando um servidor Fastify
Vamos importar o esquema que acabamos de criar e usá-lo logo após a importação de nossa biblioteca Helix em server.js, conforme mostrado abaixo:
const {envelope, useSchema, useLogger}=require (‘@ envelop/core’); const fastify=require (‘fastify’); const {processRequest, getGraphQLParameters}=require (‘graphql-helix’); const mySchema=require (“./mySchema”);//aqui
Integrando o Envelop com nosso esquema
Não importa qual servidor GraphQL e processo de integração você esteja usando, a próxima etapa é bastante simples. Em nosso exemplo, estamos usando dois plug-ins, useSchema () e useLogger () . Você pode usar quantos plug-ins quiser-você só precisa adicionar o plug-in à matriz de plug-ins, como:
const getEnveloped=envelop ({plugins: [useSchema (mySchema), useLogger ()], });
Esta é uma parte fundamental da integração porque oferece um alto nível de abstração e permite separar os componentes necessários para uso.
Em seguida, precisaremos criar um Fastify app e integrar Envelop.
const fastifyApp=fastify (); porta const=3000; fastifyApp.route ({método: [‘POST’], url:’/graphql’, manipulador assíncrono (req, res) {const {parse, validate, contextFactory, execute, schema}=getEnveloped ({req,}); const request={body: req.body, headers: req.headers, method: req.method, query: req.query,}; const {operationName, query, variables}=getGraphQLParameters (request); const result=await processRequest ({ operationName, query, variables, request, schema, parse, validate, execute, contextFactory,}); if (result.type===’RESPONSE’) {res.status (result.status); res.send (result.payload );} else {res.send ({erros: [{mensagem:’Não suportado’}]});}},}); fastifyApp.listen (port, ()=> {console.log (`O servidor GraphQL está sendo executado na porta:`, port);});
Vamos analisar esse código. Primeiro configuramos o servidor e configuramos o endpoint GraphQL. Em seguida, importamos parse, contextFactory, execute e schema da instância Envelop, como mostrado abaixo:
const {parse, validate, contextFactory, execute, schema}=getEnveloped ({req});
Estes são alguns dos parâmetros do Envelop que passaremos ao Helix para processar nossas solicitações GraphQL.
const result=await processRequest ({operationName, query, variables, request, schema, parse, validate, execute , contextFactory,});
Agora podemos executar a API com o comando node server.js para iniciar o servidor Node.
Testando o aplicativo com Postman
Devemos testar nosso aplicativo usando Postman .
Captura de tela da solicitação Postman GraphQL.
É isso! Integramos o Envelop com sucesso e adicionamos um plug-in personalizado a um aplicativo Node.
Integrando Envelop e Apollo GraphQL
Como mencionei anteriormente, você pode integrar o Envelop com qualquer servidor GraphQL. Vamos ver uma implementação com Apollo GraphQL .
Em um diretório separado, instale GraphQL, Apollo e GraphQL Tools executando o comando abaixo:
npm install @ apollo/client graphql @ graphql-tools/schema
Crie um arquivo JavaScript separado chamado app.js e adicione o seguinte código a ele.
import {ApolloServer} from’apollo-server’; import {envelope, useSchema, useLogger} de’@ envelope/core’; importar {makeExecutableSchema} de’@ graphql-tools/schema’; const schema=makeExecutableSchema ({typeDefs:/* GraphQL */`type Query {hello: String!}`, resolvers: {Query: {hello: ()=>’World’,},},}); const getEnveloped=envelop ({plugins: [useSchema (schema), useLogger ()],}); const server=new ApolloServer ({executor: async requestContext=> {const {schema, execute, contextFactory}=getEnveloped ({req: requestContext.request.http}); return execute ({schema: schema, document: requestContext.document, contextValue: await contextFactory (), variableValues: requestContext.request.variables, operationName: requestContext.operationName,});},}); server.listen (3000);
No snippet acima, criamos um esquema executável com GraphQL Tools, criamos uma instância com Envelop e adicionamos os plug-ins useSchema () e useLogger ().
const getEnveloped=envelop ({plugins: [useSchema (esquema), useLogger ()],});
Observe que useSchema e useLogger vêm pré-empacotados com Envelop.
Finalmente, no objeto de servidor Apollo, substitua o objeto executor por parâmetros do objeto Envelop. Isso é tudo que você precisa para integrar o Envelop com seu servidor Apollo GraphQL.
Conclusão
Se você construir aplicativos com GraphQL, verá que o Envelop é um ótimo complemento para o seu projeto. Isso é especialmente verdadeiro se você gosta de manter seu código DRY , já que o Envelop permite que você escreva plug-ins modulares de GraphQL que funcionam em todas as implementações de servidor GraphQL. Obrigado pela leitura!
