https://a.storyblok.com/f/270183/179109/6867f54959/e_en_translate-sms_1200x600.png

Tradução de mensagens SMS usando a API de tradução do Google Cloud

Publicado em May 13, 2021

Tempo de leitura: 11 minutos

As mensagens de texto se tornaram parte do nosso dia a dia. Nós as integramos a diversos aspectos, como serviços bancários, alertas, marketing e suporte. Agora é fácil implementá-las, e a Vonage não é exceção.

Como parte da equipe da Extend, integrar mensagens de texto com APIs de tradução faz todo o sentido. Traduzir as mensagens de texto recebidas pode ajudar a quebrar barreiras de comunicação e permitir que você alcance um público mais amplo.

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 a API de Tradução do Google Cloud.

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

Crie seu projeto

A configuração para este exemplo é mínima, e você só precisa de alguns pacotes para começar.

  • @google-cloud/translate - este é o SDK oficial do Cloud Translation

  • express - framework 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.

npm init && npm install @google-cloud/translate express dotenv body-parser # or yarn init && yarn add @google-cloud/translate express dotenv body-parser

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

touch index.js .env

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

GOOGLE_APPLICATION_CREDENTIALS=./google_creds.json
TARGET_LANGUAGE='en'

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 { Translate } = require('@google-cloud/translate');

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

Os webhooks precisam estar disponíveis publicamente para que o serviço da Vonage possa acessar o aplicativo quando forem recebidas mensagens SMS. Você pode enviar seu código para um servidor disponível publicamente ou pode usar ngrok para permitir que o tráfego público alcance 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.

ngrok http 3000

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

Configurando a API de Tradução do Google Cloud

Depois de configurar os itens iniciais, você já pode adicionar a API do Google Cloud Translation à sua Account. Siga este link para habilitar a API de Tradução. Selecione um projeto e, em seguida, clique no Enable botão para ativar a API nesse projeto.

Enable Google Cloud Translation APIEnable Google Cloud Translation API

Recomenda-se criar um service user que tenha acesso à API de tradução. Clique aqui e clique + Create Service Account.

Add New Service AccountAdd New Service Account

Dê à conta o nome que desejar e clique no Create botão. Depois que a conta for criada, adicione a Cloud Translation API User função e clique em Continue.

Add Cloud Translation API User RoleAdd Cloud Translation API User Role

Você precisará criar chaves para esse usuário. Vá em frente e clique no + Create Key botão e, em seguida, selecione JSON e clicar em “Criar”. Isso fará o download de um JSON arquivo para o seu computador, que você precisará usar para acessar a Account. Quando isso estiver concluído, clique Done para concluir o processo de criação.

Create Service Account KeyCreate Service Account Key

Create Service Account Key - Select TypeCreate Service Account Key - Select Type

Copie o arquivo de credenciais para a pasta do seu projeto:

cp /path/to/file/project-name-id.json ./google_creds.json

A API de Tradução do Google Cloud já está configurada e pronta para uso.

Em seguida, podemos configurar o número de telefone.

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 em um terminal.

Adquira um número de telefone virtual

O primeiro passo será adquirir um número (fique à vontade para usar um diferente código de país ISO 3166 alfa-2 , conforme necessário).

vonage numbers:search US Country Number Type Cost Features ─────── ─────────── ────────── ──── ───────── US 12017621343 mobile-lvn 0.90 VOICE,SMS US 12017782770 mobile-lvn 0.90 VOICE,SMS US 12018011956 mobile-lvn 0.90 VOICE,SMS US 12018099074 mobile-lvn 0.90 VOICE,SMS US 12018099756 mobile-lvn 0.90 VOICE,SMS vonage numbers:buy 12017621343 US

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:

vonage number:update 12017621343 US --url=https://my-ngrok-hostname/message

Agora, já temos o webhook configurado para receber as mensagens SMS recebidas.

Concluir a inscrição

Tudo o que resta neste tutorial é criar a rota do Express para processar os dados recebidos e algumas pequenas funções para, de fato, realizar a tradução.

Criar o Webhook

Primeiro, precisamos criar o código do webhook. A Vonage possui um recurso integrado para definir o comportamento padrão das mensagens SMS. No painel de configurações , você pode alterar o HTTP utilizado. O meu está definido como POST-JSON. Recomendo usar essa configuração, se possível; no entanto, o código usado neste exemplo irá lidar com todas as três opções, caso você não consiga modificar essa configuração.

Default Vonage SMS HTTP MethodDefault 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();
  }

};

O trecho acima é o método que passaremos para as rotas. Se a mensagem recebida estiver usando POST , ele utilizará req.body, e utilizará req.query para a GET opção. Desde que a carga útil recebida esteja configurada corretamente, o objeto será encaminhado 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.

O uso do @google-cloud/translate pacote é realmente muito simples. Primeiro, instanciamos a Translate classe, o que nos fornecerá o translate método. Ele é chamado dentro do translateText método e utiliza o text campo do objeto da mensagem SMS recebida. A target entrada é qualquer código de duas letras do idioma para o qual se deseja traduzir.

const translationApi = new Translate();

function translateText(params) {
  const target = process.env.TARGET_LANGUAGE || 'en';

  translationApi.translate(params.text, target)
        .then(results => {
           console.log(`Original Text: ${params.text}`);
           console.log(`Translation: ${results[0]}`);
         })
         .catch(err => {
           console.log('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.

node index.js
# Text "Hola" to your phone number

# expected response
Original Text: Hola
Translation: Hello

A API de Tradução do Google Cloud faz um trabalho incrível ao detectar o idioma de origem e processar a tradução rapidamente. Divirta-se e experimente.

Resumo

O exemplo acima é apenas uma breve introdução à tradução, mas deve ser um bom ponto de partida para você começar. A partir daí, você pode traduzir a mensagem recebida e, em seguida, traduzir também a mensagem enviada para o idioma correto (assunto para um próximo post no blog, com certeza).

A versão completa deste tutorial está disponível em https://github.com/nexmo-community/sms-translate-google-js.

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

Compartilhar:

https://a.storyblok.com/f/270183/384x384/444c073b5e/kellyjandrews.png
Kelly J AndrewsEx-membro da equipe

Kelly J Andrews é defensora de desenvolvedores da Nexmo e vem se dedicando à informática há mais de 30 anos, tendo usado BASIC pela primeira vez aos 5 anos de idade.

Foi só ao criar sua primeira página da web, em 1997, e ao experimentar o JavaScript pela primeira vez que ele descobriu sua verdadeira vocação. Hoje, Kelly luta pelo JavaScript, pelo código testável e pela entrega rápida.

É possível encontrá-lo cantando no karaokê, fazendo truques de mágica ou torcendo pelos Cubs e pelos Fighting Irish.