Subscription GraphQL + Node

Eae Galera, hoje vou compartilhar um pouco de conhecimento com vocês, como fazer uma subscription no GraphQL do lado do back-end. Mas primeiro de tudo, o que é uma subscription? As subscriptions, como diz o nome são assinaturas (AVA CINTHIA HAHA)

Assim como as Querys, elas permitem que você busque dados. Mas então qual a diferença de uma subscription para uma Query ? As subscriptions mantém uma conexão ativa com o seu servidor GraphQL, isso permite que seu servidor envie atualizações para a sua assinatura em tempo real.

Ok, entendemos o que são subscriptions mas pra que ela serve? Por que eu usaria algo assim? Imagine que você tem um sistema para uma lojinha online de roupas, onde consegue realizar vendas, sendo assim você gostaria de receber uma notificação toda vez que um novo produto é vendido, pensando na utilização de uma query, seria necessário definir um gatilho para executar a consulta a cada X tempo, mas sera que isso realmente nos atende como esperado? Dessa forma teriamos que ficar executando querys inumeras vezes e muitas vezes de forma desnecessária já que posso não ter nenhuma atualização e não teriamos uma notificação em tempo real, por exemplo: Nos definimos o tempo de 5 minutos para executar uma busca, então as 14:00h a query é executada e não retorna nenhuma notificação, as 14:01 uma compra é feita mas nossa query só sera executada novamente as 14:05.

Vamos a um exemplo um pouco mais real, imagine que a sua loja seja fisica mas a porta fique sempre fechada e você gostaria de saber toda vez que um novo cliente chega, como você faria isso? Óbvio né Cinthia, o cliente vai chamar!! Ok, agora imagine que você tem um escritório na sua loja onde você não consegue escutar nada, dessa forma não ira escutar seu cliente chamando, então você decide que a cada 5 minutos ira na porta ver se tem alguém, isso é você executando nossa query, além de ficar cansado de ir na porta a cada 5 minutos, cai no problema de horário relatado a cima, você foi a porta as 14h, voltou para o escritório, seu cliente chegou as 14:01 mas você só ira verificar outra vez as 14:05.Deixou o seu cliente esperando por 4 minutos. Agora imagine que você instala uma campainha que ira te avisar no momento exato que o cliente chegar!! TCHARAAAAAM, sua subscription.

Agora que você ja sabe o que é e para que serve, vamos aos códigos.

1 — Criação de uma Instância PubSub

O nosso primeiro passo será criar uma Instância PubSub que será responsável por gerenciar as subscriptions no servidor.

A PubSub é uma classe que nos fornece uma API de publish e subscribe.

Então no nosso arquivo server.js iremos adicionar o seguinte código para criar nossa instância.

com a instância criada basta passar ela para o nosso servidor

Definindo a Subscription

Agora iremos criar uma subscription que vai nos informar quando uma nova venda foi realizada e nos retornar a mesma. Assim como nossas Querys e Mutations, precisamos definir nossas Subcriptions

Vamos adicionar Subscripton no nosso arquivo schema.graphql.

Resolver Subscription

Indo para o arquivo resolver.js iremos incrementar o resolver da subscription que retorna uma asyncInterator que ira escutar os eventos de forma assíncrona e emitir para todos os clientes assinados no tópico que estamos passando, nesse caso o ‘PUBSUB_NOVA_VENDA’. Obtemos esse asyncInterator através do nosso pubsub.

Publicando Eventos na Subscription

Ja temos alguém escutando todos os eventos do nosso tópico ‘PUBSUB_NOVA_VENDA mas agora precisamos publicar o evento nesse tópico, nesse caso queremos saber toda vez que uma nova venda for feita, para isso iremos na nossa mutation responsável por registrar uma venda. No resolver dessa mutation iremos publicar um novo evento toda vez que uma venda for registrada com sucesso, para isso vamos utilizar o método publish do nosso pubsub, passando o tópico em que iremos publicar e a informação desejada, nesse caso estamos passando nossa venda.

Testando nosssa Subscription

Prontinho, Agora temos uma subscription funcionando e prontinha para uso!!

Vou deixar aqui o link do repositório no Git com o código que fiz para esse artigo, espero que tenham gostado :D

Link repositório: https://github.com/cicinth/subscription-graphql

Referências :

https://github.com/prisma-labs/graphql-yoga

https://www.apollographql.com/docs/apollo-server/data/subscriptions/

https://www.youtube.com/watch?v=_r2ooFgBdoc&ab_channel=BenAwad