Receba mensagens SMS com Node.js, Express e a SMS API da Vonage

No artigo anterior, você configurou sua Account da Vonage e aprendeu como enviar mensagens SMS com o Node.js. Nesta postagem do blog, você aprenderá a receber uma mensagem SMS de entrada implementando um endpoint de webhook no Node.js usando Express.

Visualizar o código-fonte no GitHub

Definindo um ponto de extremidade de webhook

Para receber uma mensagem SMS da Vonage, você precisa associar um endpoint de webhook (URL) a um número virtual que você tenha alugado da Vonage. As mensagens recebidas para esse número são, então, enviadas para o seu endpoint de webhook.

Ao desenvolver o endpoint do webhook, é um saco ficar implantando constantemente o seu trabalho em andamento. Para facilitar a sua vida, vamos usar o o ngrok para expor seu endpoint de webhook na sua máquina local como uma URL pública!

Usando o ngrok

Primeiro, baixe o ngrok em https://ngrok.com. Após a instalação, execute o ngrok no terminal:

running ngrok

Seu servidor local (localhost:3000) agora possui uma URL do ngrok como https://71f03962.ngrok.io que pode ser usada como seu endpoint de webhook durante o desenvolvimento. Além disso, observe a URL da interface web — você pode inspecionar, modificar e reproduzir suas solicitações aqui — falaremos mais sobre isso depois!

Configurando o endpoint do webhook com a Vonage

Faça login no seu Account da Vonage e acesse Configuraçõese localize as seção “Configurações de SMS” .

A Vonage possui duas APIs diferentes capazes de enviar e receber mensagens SMS. Você só pode usar uma de cada vez, pois isso alterará o formato dos webhooks que você recebe. Desta vez, vamos usar a SMS API, portanto, certifique-se de que ela esteja selecionada.

Em seguida, preencha os campo “Webhooks de SMS de entrada” usando a URL do ngrok com uma rota — vamos chamá-la de “inbound”. Digite https://YOUR_NGROK_URL/inbound, defina o método HTTP para POST e clique em Salvar alterações.

setting your webhook endpoint

Agora, todas as suas mensagens recebidas serão encaminhadas para a URL do webhook (callback); então, vamos escrever um código usando o Node.js e o Express!

Observação: Acima, estamos configurando o endpoint do webhook para SMS no nível da conta. Como alternativa, você também pode configurar endpoints de webhook exclusivos para cada número virtual clicando em Gerenciar ao lado de um de seus números virtuais no painel da Vonage.

Criação de endpoints de webhook com o Express

Em seguida, você tratará das POST solicitações com Express; portanto, instale-o.

Adicione "type": "module" ao seu package.json arquivo para habilitar as instruções .

Crie um .js arquivo, instancie o Express e escute na porta 3000. Como você configurou o ngrok para expor localhost:3000, você deve usar a mesma porta.

import express from 'express';

const { json, urlencoded } = express;

const app = express();

app.use(json());
app.use(
    urlencoded({
        extended: true
    })
);

const PORT = 3000;
app.listen(PORT, () => {
    console.log(`Server listening at http://localhost:${PORT}`);
});

Em seguida, crie uma rota HTTP POST para processar as solicitações:

app.post('/inbound', (req, res) => {
  handleParams(req.body, res);
});

Em seguida, defina a handleParams função:

function handleParams(params, res) {
  if (!params.to || !params.msisdn) {
    console.log('This is not a valid inbound SMS message!');
  } else {
    let incomingData = {
      messageId: params.messageId,
      from: params.msisdn,
      text: params.text,
      type: params.type,
      timestamp: params['message-timestamp']
    };
    console.log('Success', incomingData);
  }
  res.status(200).end();
}

Execute o código do Node.js e tente enviar algumas mensagens do seu celular para o seu número virtual!

screenshot of a user sending an sms message from an Android phone

Ao criar um túnel para seu aplicativo local com o ngrok, você também pode inspecionar a solicitação em http://127.0.0.1:4040/ no seu navegador:

ngrok inspector

Pronto, agora você pode ver que sua mensagem SMS foi enviada. A Vonage recebeu a mensagem e a encaminhou para o seu aplicativo Express por meio de um Webhook!

Espero que isso tenha sido útil para você. Entre em contato conosco @VonageDev no Twitter.

Referências

• SMS API da Vonage

• Ngrok