Tradução de mensagens SMS com o Azure Translator Text

Em meus posts anteriores, mostrei como é possível traduzir mensagens de texto com a API de Tradução do Google, AWS Translatee IBM Watson Language Translator.

Visão geral

Nesta postagem, vou mostrar como criar um webhook de SMS de entrada da Vonage e traduzir a mensagem para o inglês usando o Azure Translator Text.

Para começar, você precisará ter os seguintes itens configurados:

• Azure

• CLI da Vonage instalado

Crie seu projeto

Você só vai precisar de alguns pacotes para dar início ao projeto.

• @azure/ms-rest-js—este é o SDK do Azure e vai ajudar com as credenciais

• @azure/cognitiveservices-translatortext—este é o SDK de texto do Azure Translator

• express—estrutura web para hospedar o webhook

• dotenv—um pacote para carregar variáveis de ambiente

• body-parser—middleware para o Express destinado a processar o objeto webhook recebido

Inicialize o projeto e, em seguida, instale os pré-requisitos acima usando npm ou yarn.

Após a instalação, crie um index.js e .env arquivo.

Em seguida, abra o index.js arquivo e insira o seguinte código nele:

'use strict';
require('dotenv').config();

const express = require('express');
const bodyParser = require('body-parser');
const CognitiveServicesCredentials = require("@azure/ms-rest-js");
const { TranslatorTextClient } = require("@azure/cognitiveservices-translatortext");

const app = express();

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

const server = app.listen(3000, () => {
  console.log(`Express server listening on port ${server.address().port} in ${app.settings.env} mode`);
});

Isso configurará o servidor para executar o exemplo.

Instalando o ngrok

São necessários webhooks disponíveis publicamente para que a Vonage possa se comunicar com o aplicativo e receber mensagens SMS recebidas. Você pode enviar seu código para um servidor disponível publicamente ou pode usar ngrok para permitir que o tráfego público chegue ao seu aplicativo local.

Você pode saber mais sobre como instalar ngrok nesta este post. Depois de ter tudo pronto, você pode iniciar o ngrok usando o comando a seguir para criar seu túnel.

Anote o ngrok endereço, pois você precisará dele em uma etapa posterior.

Configurando o Azure Translator para texto

Em seguida, você pode configurar o serviço Azure Translator Text no Portal do Azure. Comece abrindo o portal e clicando em Create New Resource.

Azure Portal Home Page

Na próxima tela, faça uma busca por Translator Text e clique no resultado para ser direcionado à página de informações do texto do Tradutor. Clique Create para iniciar o processo.

Translator Text Create Resource Screen

Preencha o nome, selecione Pay As You Go e o grupo de recursos e, em seguida, clique Create na parte inferior da página.

Translator Text Create Resource Details

O processo de criação leva alguns instantes; então, relaxe um pouco até que ele termine.

Abra o .env arquivo primeiro e copie e cole o seguinte:

TEXT_TRANSLATION_SUBSCRIPTION_KEY=
TEXT_TRANSLATION_ENDPOINT=https://api.cognitive.microsofttranslator.com/translate

Pegue a chave e o endpoint na página de início rápido e atualize o .env arquivo com essas informações.

Durante meus testes, tentei usar o endpoint de serviços apresentado no painel, mas não consegui fazê-lo funcionar corretamente. A URL acima é o endpoint global que funcionará caso você enfrente os mesmos problemas.

Translator Text Resource Quickstart

Configurando mensagens SMS recebidas do Vonage

Este exemplo requer um número de telefone da Vonage para receber mensagens recebidas. Podemos fazer isso usando o CLI da Vonage diretamente no seu terminal.

Adquira um número de telefone virtual

Primeiro, adquira um número diretamente da Vonage (fique à vontade para usar um código de país ISO 3166 alfa-2 , conforme necessário).

Embora a rota a ser usada no aplicativo ainda não esteja configurada, você deve nomeá-la /message. O número de telefone precisa estar vinculado a essa rota para que as mensagens recebidas saibam para onde devem ser encaminhadas. Obtenha o ngrok nome do host da configuração anterior e use-o aqui:

Agora, o webhook da Vonage está configurado para encaminhar mensagens SMS recebidas.

Concluir a inscrição

Agora, basta criar a rota do Express e as funções para processar a mensagem SMS recebida e as traduções.

Criar o Webhook

Podemos configurar o manipulador de rota primeiro. O Vonage permite definir um comportamento padrão para o webhook de SMS. No painel de configurações é possível alterar o HTTP utilizado. O meu está definido como POST-JSON, e recomendo usar essa configuração. Se você não conseguir modificar sua configuração, o código usado aqui lidará com todas as três opções.

Default Vonage SMS HTTP Method

Abra o index.js arquivo e, na parte inferior, cole o seguinte código:

// Reading the inbound SMS messages
const handleRoute = (req, res) => {

  let params = req.body;

  if (req.method === "GET") {
    params = req.query
  }

  if (!params.to || !params.msisdn) {
    res.status(400).send({'error': 'This is not a valid inbound SMS message!'});
  } else {
    translateText(params);
    res.status(200).end();
  }

};

Esse manipulador será passado diretamente para a /message rota. Se o método HTTP da mensagem recebida for POST, o manipulador usa req.bodye utiliza req.query para a GET opção. Em seguida, ele verifica a carga útil recebida para garantir que contenha as informações corretas e, então, envia o objeto ao translateText método para exibir a tradução.

Agora você pode adicionar a rota e os HTTP métodos à aplicação.

app.route('/message')
  .get(handleRoute)
  .post(handleRoute)
  .all((req, res) => res.status(405).send());

O código acima criará o GET e POST para lidar com qualquer uma das opções da mensagem de webhook de SMS recebida. Se qualquer outro método for usado, uma 405 - Method Not Allowed resposta será retornada.

O webhook já está pronto para uso e a única coisa que falta são as traduções propriamente ditas.

Método de tradução

Na etapa anterior, chamamos translateText. Esta etapa criará esse método.

Inicialmente, você obterá suas credenciais usando CognitiveServicesCredentials.ApiKeyCredentials. Isso precisará ser passado como o primeiro parâmetro para o TranslatorTextClient construtor.

Depois de criar o client, use o translate método para traduzir o texto. O primeiro argumento é uma matriz de idiomas para os quais você deseja traduzir o texto — permitindo que você traduza para vários idiomas. O serviço detectará automaticamente o idioma de origem, se possível. O segundo argumento é uma matriz de objetos correspondentes ao texto que você deseja traduzir.

function translateText(params) {
  const creds = new CognitiveServicesCredentials.ApiKeyCredentials({ inHeader: { 'Ocp-Apim-Subscription-Key': process.env.TEXT_TRANSLATION_SUBSCRIPTION_KEY } });
  const client = new TranslatorTextClient(creds, process.env.TEXT_TRANSLATION_ENDPOINT);

  client.translator
    .translate(["en"], [{text:params.text}])
    .then(result => {
      console.log(`Original Text: ${params.text}`);
      console.log(`Translation: ${result[0].translations[0].text}`)
    })
    .catch(err => {
      console.error("error:", err);
    });
}

Agora você pode testar a funcionalidade iniciando o servidor e enviando uma mensagem de texto para o número que você adquiriu anteriormente.

O objeto de resposta completa do Azure Translator Text também contém muitos detalhes; assim, você pode alterar a resposta para incluir console.dir(translationResult, {depth: null}) para visualizar a carga útil completa.

Resumo

O Azure Translator Text é uma ótima ferramenta para traduzir suas mensagens recebidas do Vonage. Este exemplo é apenas uma introdução, mas deve servir como um bom ponto de partida. A partir daqui, você pode explorar várias possibilidades usando isso como ponto de partida. Me conte quais são suas ideias para usar esses dois serviços em conjunto.

Você pode encontrar uma versão completa deste tutorial em https://github.com/nexmo-community/sms-azure-translate-js.

Se você quiser saber mais sobre os projetos do Extend que temos, pode acessar https://developer.vonage.com/extend para saber mais.