Executando verificação de segurança...
4
maiconrcf
1 min de leitura ·

PITCH: Envio de Webhooks para o WhatsApp [SIDE-PROJECT]

Fala pessoal,

Lançando hoje o beta de um novo side project:

https://whatshook.io

Esse projeto faz parte de uma série de side projects que estou desenvolvendo.

Uma das minhas teses atuais, é desenvolver como produto(SaaS) tudo aquilo que eu já faria para mim mesmo. E o WhatsHook nasceu de uma demanda minha mesmo de receber algumas notificações de um determinado Webhook de cadastros e pagamentos, direto no meu WhatsApp.

Exemplo Prático: digamos que você queria receber no seu WhatsApp uma notificação sempre que um pagamento for confirmado no seu gateway de pagamentos. Então você vai lá nas configurações de Webhook do seu gateway e adiciona a URL gerada pela WhatsHook. Assim você receberá um WhatsApp a cada novo pagamento com o payload da notificação. Pode servir para você ficar informado sobre status de determinados eventos ou então para depurar alguma integração.

Espero que possa ser útil também aos amigos e estou aberto a feedbacks.

Maicon Ferreira
https://side.tech

Abs.

Carregando publicação patrocinada...
1
1
maiconrcf
Autor
Autor

Tranquilo, digamos que você queria receber no seu WhatsApp uma notificação sempre que um pagamento for confirmado no seu gateway de pagamentos. Então você vai lá nas configurações de Webhook do seu gateway e adiciona a URL gerada pela WhatsHook. Assim você receberá um WhatsApp a cada novo pagamento com o payload da notificação. Pode servir para você ficar informado sobre status de determinados eventos ou então para depurar alguma integração.

2
1
1
2
1
1
1
1
1
maiconrcf
Autor
Autor

Não é mas se quiser saber como foi desenvolvido, não tem nenhum segredo: O projeto está em Laravel e foi usado esse carinha aqui para as notificações no WhatsApp: https://wwebjs.dev. Para cobrança utilizei o Laravel Spark e host AWS com ajuda do Forge para deploy.

1
weers

Que legal cara!! Parabens pelo belo projeto!

Bom, fiquei bastante curioso em relação a sua aplicação, e gostaria de fazer algumas perguntas para você.

Porque decidiu usar a biblioteca wwebjs.dev, em vez de outras que tambem são open source, tipo uma venom-bot por exemplo ?

Onde você hospeda sua aplicação? (gostaria de uma recomendação em termos de preço e etc...)

Sucesso a você Maicon!

1
maiconrcf
Autor
Autor

Claro, o que quiser saber e só perguntar.

Usei essa lib porque foi a primeira que encontrei, confesso que não me apego mais tanto em quais tecnologias ou bibliotecas vou utilizar. O meu foco hoje é entregar um produto rápido e de qualidade para tentar rentabilizar o quanto antes.

Todos os meus projetos estão na AWS, possuo um cupom que vale por 2 anos e me dá um gás para poder tocar esses projetos até que eles comecem a se pagar. Uma coisa que mudei e acho que foi muito bom é que agora eu configurei somente uma máquina(EC2) e todos os projetos eu coloco nessa mesma máquina. Só crio uma estrutura individual assim que determinado projeto começar a ganhar corpo. Isso me poupa muito trabalho hoje em dia.

Depois que comecei a usar a AWS há uns 6 anos atrás, não usei outro host. Para projetos Laravel, a AWS + Forge é uma mão na roda gigante.

1
danielcaze

Como conseguiu o cupom?

tentei fazer algo muito parecido, no azure usando uma VM classica, mas tinha limite de uso de processamento e era apenas por 12 meses.

1
1
1
1
1
1
1
1
LorhanSohaky

Muito maneiro! Só de curiosidade, você está usando um número de telefone especial? Em cada mensagem está colocando algum tipo de ID? Pergunto isso para que seu número não seja banido (temporariamente ou permanentemente)

1
maiconrcf
Autor
Autor

Muito obrigado pelo feedback. É um número normal mesmo, comprado na VIVO :) Por enquanto tem esse risco sim, mas como é um beta estou testando. Para evitar esse bloqueio pretendo adicionar uma validação de número para certificar que somente o prórpio usuário está recebendo as mensagens e não está utilizando como uma API por exempo para envio massivo.

1
RafaelRNF

Muito interessante, mas não consegui receber um teste(e depois consegui :D), aí algumas dicas/melhorias

  1. Coloque uma confirmação na adição do número, do jeito que ta hoje pode adicionar qualquer número e até gerar um 'spam', além de não saber se o número está correto ou não. Coloquei meu número 55 ddd e 9 digitos, depois +55 ddd 9 digítos e aí fui ver o 'placeholder' e vi que eram 8 digitos, tentei e deu certo. Então se tivesse uma confirmação de número já teria como ver isso.
  2. Pensando no problema que eu tive é bom tanto melhorar o placeholder porque ele ta com espaços no exemplo e adicionar uma mascara pra ajudar a digitar no formato correto, além de permitir colocar os 9 digitos que é o 'padrão br'.
  3. O webhook aparentemente só aceita "POST", seria interessante aceitar todos os 'verbos' e também mostrar qual o verbo usado, tente ver o formato desse aquiwebhook.site e implementar dessa forma.

São algumas dicas pra melhorar um pouco seu sistema. Muito legal esse seu projeto.

1
maiconrcf
Autor
Autor

Fala Rafael, obrigado pelas dicas, muito valiosas. Realmente pensei já em adicionar uma verificação, mas sabe como é neh, melhor feito que perfeito :) . Mas vou já adicionar para os próximos passos, é importante. Pretendo colocar uma mascára de telefone também. E sobre os outros "verbos", pretendo adicionar tbm sim, até mesmo o GET pegando os params direto da URL. Obrigado novamente Rafael pelo comentário e pelas dicas.

1
RafaelRNF

Isso, com certeza feito é muito melhor :), mas acho que é super importante colocar a verificação do número, até mesmo pra confirmar que ta tudo funcioando, porque é preciso enviar uma requisição pra poder testar, a mascara e verbos pode vir no futuro.
Essa ideia é muito boa, porque da pra fazer umas coisas bem legais, atualmente tô trabalhando com uma integração na Amazon(marketplace) e são feitos uns disparos quando os itens tem algum problema, é bem interessante receber isso no whatsapp.

1
Glayson

Legal! Gostei da solução para seu problema. Parabéns!

Pode ser até interessante fazer com que o webhook também replique as informações em outras plataformas conforme interesse do usuário, por exemplo: Telegram, Slack, Viber, serviço de e-mail e etc.

1
maiconrcf
Autor
Autor

Fala Glayson, obrigado pela contribuição. Vou adicionar sua ideia para implementação. A ideia realmente é que o WhatsApp seja o primeiro mas quero adicionar outros canais também. Até uma curiosidade, a palavra Whats do WhatsHook não quis tanto me referir somente ao WhatsApp mas sim no sentido da palavra "Whats", no sentido de "QUAL" Webhook :)

1
1
thecollie

Só usar o postman ou insomnia com os dados no body.

Exemplo:

curl --request POST \
  --url https://whatshook.io/{RANDOM} \
  --header 'Content-Type: application/json' \
  --data '{
	"name": "Novo pagamento",
	"user": "[email protected]"
}'
1
thecollie

Fala Maicon, blz? Cara muito legal a sua ferramenta.

Seria legal eu criar um template para as mensagens recebidas. Digamos que o webhook do meu gateway de pagamento mande o body assim:

{
    "plan": "Plano Ouro",
    "client": {
        "name": "John",
        "email": "[email protected]"
    },
    "value": 97.90
    ...
}

Ai eu poderia criar o template assim:

Olá, você tem um novo pagamento feito por ${client.name} com email ${client.email} que comprou o plano ${plan} no valor de ${value}

Ai eu receberia essa mensagem em vez do body do request. Ai poderia ter um recurso também de valor default para o "placeholder" da mensagem. Por exemplo:

Olá, você tem um novo pagamento feito por ${client.name:"sem nome"} com email ${client.email:"sem e-mail"} que comprou o plano ${plan:"Plano básico"} no valor de ${value:"sem valor"}

Sucesso!

1
maiconrcf
Autor
Autor

Fala tudo bem? Obrigado pelo feedback. Acabei de implementar sua ideia :)
Só não consegui implementar o placeholder mas você já pode definir uma mensagem personalzida conforme os parametros enviados :)