Crie um menu de resposta de voz interativa usando Node.js e Express

Introdução

A Voice API da Vonage é a maneira mais fácil de criar aplicativos de voz de alta qualidade na nuvem.

Neste tutorial, vamos criar um menu de resposta de voz interativo usando a Voice API da Vonage e o Node.js para receber chamadas e capturar as entradas do usuário por meio do teclado.

A título de referência, o arquivo-fonte deve ficar mais ou menos assim este aqui assim que este exercício estiver concluído.

Pré-requisitos

Antes de começar, certifique-se de ter os seguintes itens instalados:

• Node.js instalado. O Node.js é um ambiente de execução de JavaScript de código aberto e multiplataforma.

• ngrok - É necessária uma conta gratuita. Essa ferramenta permite que os desenvolvedores exponham um servidor de desenvolvimento local à Internet.

• OPCIONAL - CLI do Vonage Depois de instalar o Node.js, instale a CLI digitando npm install -g @vonage/cli. Essa ferramenta permite criar e gerenciar Applications da Vonage a partir de uma interface de linha de comando, em vez de usar o Portal do Desenvolvedor da Vonage.

Criar uma aplicação da Vonage com recursos de voz

Para usar a Voice API da Vonage, é necessário criar um Aplicativo Vonage no portal do desenvolvedor.

Precisaremos configurar os webhooks do aplicativo e outras coisas. Observe que isso pode ser feito por meio do Portal do Desenvolvedor da Vonage ou pela CLI da Vonage. Para este tutorial, usaremos o Painel de Controle do Desenvolvedor da Vonage.

Depois de criar um Account, faça login no Painel do Desenvolvedor da Vonage e procure a seção “Aplicativos”e crie um novo aplicativo. Dê um nome ao seu aplicativo, como IVRMenu.

IVRMenuCall.png

Role a página para baixo e certifique-se de que o Voice esteja ativada.

Anote o Respostae URLs , pois vamos preenchê-las em breve. Vamos deixar a URL de fallback em branco durante este tutorial.

VoiceCapability.png

Imprensa Gerar novo pedido na parte inferior da página para continuar.

Este tutorial também requer um número de telefone virtual. Para adquirir um, acesse Numbers > Comprar Numbers e procure um que atenda às suas necessidades. Depois de obter um número, vincule-o ao Painel do Desenvolvedor da Vonage, conforme mostrado abaixo.

LinkedNumber.png

A seguir, usaremos o ngrok para expor nossos endpoints de webhook em nossa máquina local como uma URL pública.

Executar o ngrok

O ngrok é um aplicativo multiplataforma que permite aos desenvolvedores expor um servidor de desenvolvimento local à Internet com o mínimo de esforço. Vamos usá-lo para expor nosso serviço à Internet. Depois de configurar o ngrok e fazer login (novamente, a conta gratuita é suficiente), execute o seguinte comando:

ngrok http 3000

Depois que o ngrok for executado, ele fornecerá um URL de redirecionamento que usaremos como base para nossos Webhooks mais adiante neste artigo. O meu é semelhante ao seguinte:

ngrok.png

Lembre-se do Resposta e URLs no Portal do Desenvolvedor da Vonage, conforme mencionado anteriormente? Precisaremos usar a URL do ngrok e preencher cada campo, acrescentando /answer e /event, para a URL de resposta e a URL de evento.

Então, por exemplo, o meu Resposta está apontando para https://9ebc-2601-600-9580-d650-fd8d-62dc-f5e4-b88e.ngrok.io/answer e O URL para https://9ebc-2601-600-9580-d650-fd8d-62dc-f5e4-b88e.ngrok.io/event.

webhooksection.png

Quando você ligar para o número associado ao aplicativo e a ligação for atendida, o webhook definido no URL de Resposta é acionado. Da mesma forma, os eventos são registrados por meio de uma solicitação POST e são acionados ao ligar para o número ou se o número estiver ocupado, etc.

Configuração de um projeto Node.js

Agora que criamos nosso aplicativo Voice da Vonage no painel do desenvolvedor, vamos ver como devemos configurar nosso aplicativo Node.js.

Comece abrindo uma janela de comando/terminal, criando um diretório de trabalho e inicializando um projeto Node.js.

Vamos dar andamento às solicitações com Express e usaremos o body-parser para analisar os corpos das solicitações recebidas. Instale ambos com o seguinte comando:

npm install express body-parser --save

Crie um index.js arquivo, instancie o Express e o body-parser.

const app = require('express')()
const bodyParser = require('body-parser')

app.use(bodyParser.json())

Vamos definir o endpoint para a URL da resposta como /answer e a URL do evento como /event.

Quando um usuário pressiona um número no teclado, é possível identificar qual tecla foi pressionada por meio do DTMF (Dual Tone Multifrequency). Sempre que uma entrada DTMF é recebida do usuário, ela é enviada ao nosso /dtmf manipulador, que definiremos na próxima etapa.

Crie uma rota HTTP GET para processar as solicitações de /answer para recuperar seu NCCO:

app.get('/answer', (req, res) => {
  const ncco = [{
      action: 'talk',
      bargeIn: true,
      text: 'Hello! Please enter a digit to continue.'
    },
    {
      action: 'input',
      maxDigits: 1,
      eventUrl: [`https://${req.get('host')}/dtmf`]
    }
  ]

  res.json(ncco)
})

Vamos usar a talk ação para cumprimentar quem está ligando e pedir que digite um número, definindo a bargeIn opção para true para que o usuário possa digitar um número sem esperar que a mensagem falada termine.

Em seguida, vamos adicionar um input ao NCCO para capturar o dígito via DTMF. Defina a maxDigits propriedade como 1 e o eventURL um manipulador para receber e processar a entrada. Observe que você pode ampliar o número de pressionamentos de teclas que um usuário pode realizar por meio da maxDigits propriedade.

Processar a entrada do usuário

Vamos adicionar o código para processar os sinais DTMF recebidos em index.js. A Vonage faz uma POST solicitação ao nosso webhook, que vamos expor como um endpoint em /dtmf. Ao recebermos a solicitação, criaremos outra talk ação que inspeciona o objeto da solicitação e retorna os dígitos que o chamador digitou:

app.post('/dtmf', (req, res) => {
  const ncco = [{
    action: 'talk',
    text: `You pressed ${req.body.dtmf}`
  }]

  res.json(ncco)
})

O endpoint para a event_url precisa ser POST, então vamos definir /events:

app.post('/events', (req, res) => {
  console.log(req.body)
  res.send(200);

Isso registrará todos os eventos acionados em nosso terminal/linha de comando.

Executar o aplicativo

Digite o seguinte no prompt do comando/terminal para executar o aplicativo:

node index.js

Vamos fazer uma ligação para verificar se seu aplicativo funciona! Ligue para o seu número virtual usando seu celular e digite um dígito no teclado. Se tudo estiver funcionando, você deverá ouvir a mensagem que definiu no seu NCCO: “Você digitou X.”

Conclusão

Agora que você criou um menu de resposta de voz interativa usando a Voice API da Vonage e o Node.js, por que não aprender a enviar mensagens de conversão de texto em fala em mais de 40 idiomas? Você também pode saber mais sobre nossa Voice API e explorar vários trechos de código.

Se você tiver dúvidas ou sugestões, junte-se a nós no Slack dos desenvolvedores da Vonage ou me envie um tweet no Twitter, e eu entrarei em contato com você. Mais uma vez, obrigado pela leitura, e nos vemos no próximo artigo!