Enruta SMS a Correo Electrónico de Manera Bidireccional con SendGrid y Twilio

Tiempo de lectura: 6 minutos

March 04, 2020
Redactado por
Toby Allen
Twilion

Two-way sms to email

Muchas empresas quieren comunicarse por SMS con sus clientes, y a la vez integrar estos canales con procesos internos establecidos, como las bandejas de entrada de correo electrónico compartidas. ¿Comparte un teléfono móvil con su equipo o ha optado  por usar una solución híbrida de correo electrónico a SMS que le resulta inflexible porque se rige por estrictas reglas de enrutamiento?

Ahora, con el poder del correo electrónico Twilio SendGrid y Twilio SMS, puede configurar rápidamente su propia solución de reenvío de correo electrónico bidireccional a SMS.

En este breve tutorial, aprenderá a cómo enrutar mensajes desde un número compatible con Twilio SMS a una bandeja de entrada compartida y viceversa. Lo haremos enviando mensajes SMS entrantes a un correo electrónico utilizando la API SendGrid. Aprovecharemos la funcionalidad Inbound Parse  de SendGrid para llamar a la API de mensajería Twilio. En ambos casos, vamos a utilizar una pequeña función de JavaScript alojada en el entorno "serverless" de Zeit. Se ha elegido a Zeit para esto porque admite la recepción de solicitudes de datos multipart/form-data que son necesarias para el webhook de análisis entrante.

Tutorial de reenvío de SMS y correo electrónico: requisitos

Para seguir este tutorial, necesitará los siguientes elementos:

  • Una cuenta Twilio: si no ha usado Twilio antes, puede crear una cuenta de prueba con un crédito de prueba de US $15
  • Una cuenta Twilio SendGrid: si no tiene una,  puede crear una cuenta gratuita, que le permite enviar 100 correos electrónicos al día.
  • Una cuenta Zeit: descubra más sobre Zeit y cree una aquí.
  • Una cuenta GitHub si desea utilizar la opción de implementación rápida.

Cómo funciona

Antes de sumergirnos en la configuración, miremos cómo funciona. Cuando se envía un SMS al número de teléfono de Twilio, lo recibimos y lo pasamos al correo electrónico de destino.

Demostración de SMS entrantes a correo electrónico

Incoiming SMS reenviado a correo electrónico a través de SendGrid

Si se responde el mensaje de correo electrónico, se lo enviaremos al remitente original como un SMS.

Responder a un SMS por correo electrónico

De igual manera, cualquiera puede enviar un SMS enviando un correo electrónico con la siguiente forma: <código de país> <número de teléfono> @ <dominio de correo electrónico>. SendGrid lo reenviará a nuestra función, que extraerá el cuerpo y lo enviará como un SMS al número de teléfono especificado en la dirección de correo electrónico.

De SMS a correo electrónico

Esta función es activada por un WebHook de Twilio cada vez que llega un mensaje a nuestro número de teléfono de destino. La función crea un array para describir el correo electrónico y utiliza el cuerpo del texto entrante como el cuerpo del correo electrónico. Especificamos la dirección de correo electrónico de origen como <número de teléfono de envío> @ <dominio de correo electrónico> para que pueda responder al correo electrónico y que el mensaje SMS vuelva al remitente.

const sgMail = require('@sendgrid/mail');
const MessagingResponse = require('twilio').twiml.MessagingResponse;
module.exports = (req, res) => {
    //Specify API Key for Sendgrid
    sgMail.setApiKey(process.env.SENDGRID_API_KEY);

    //Set from address as <number>@EMAIL_DOMAIN
    const fromAddress = req.body.From.replace("+", "") + `@${process.env.EMAIL_DOMAIN}`;

    //Create Email
    const email = {
        to: process.env.TO_EMAIL_ADDRESS,
        from: fromAddress,
        subject: `New SMS message from: ${req.body.From}`,
        text: req.body.Body,
    };
    
    // Send the email
    sgMail.send(email)
        .then(response => {
            res.status(200).send(response); //Make sure we return correctly.
        })
};

Reenviar correo electrónico a SMS

Esta función es un poco más complicada que la anterior, ya que SendGrid usa multipart/form-data en su webhook. Esto significa que necesitamos pasar la solicitud a través de una librería llamada multer, que está diseñada para manejar estas solicitudes. Luego podemos extraer el número de teléfono y el cuerpo del mensaje. Usamos la librería Twilio NodeJS para enviar el mensaje. Si hay algún error, lo capturamos y los enviamos por correo electrónico al remitente.

const util = require('util');
const multer = require('multer');
const addrs = require("email-addresses");
const sgMail = require('@sendgrid/mail');
const twilio = require('twilio');

module.exports = async (req, res) => { 
    const client = twilio(process.env.TWILIO_ACCOUNT_SID,process.env.TWILIO_AUTH_TOKEN);
    await util.promisify(multer().any())(req, res);

    const from = req.body.from;
    const to = req.body.to;
    const subject = req.body.subject;
    const body = req.body.text;

    //Using email-addresses library to extract email details.
    const toAddress = addrs.parseOneAddress(to);
    const toName = toAddress.local;
    const fromAddress = addrs.parseOneAddress(from);
    const fromName = fromAddress.local;

    //Sending SMS with Twilio Client
    client.messages.create({
        to: `+${toName}`,
        from: process.env.TWILIO_PHONE_NUMBER,
        body: `Message from:${fromName}\n${body}`
    }).then(msg => {
        console.log(msg)
        res.status(200).send(msg.sid);
    }).catch(err => {
        //If we get an error when sending the SMS email the error message back to the sender
        sgMail.setApiKey(process.env.SENDGRID_API_KEY);

        // Create Email
        const email = {
            to: fromAddress.address,
            from: toAddress.address,
            subject: `Error Sending SMS to ${toAddress.local}`,
            text: `${err}\n For email from ${fromAddress.address}`,
        };
        //Send Email
        sgResp = sgMail.send(email)
            .then(response => {
                res.status(200).send("Sent Error Email");
            })
            .catch(error => {
                res.status(500);
            });
    });
};

Información para la aplicación serverless

Antes de que podamos empezar la ejecución de la aplicación, necesitaremos ciertos elementos:

  • Twilio Account SID y Auth Token, que están disponibles en el panel de la cuenta. (Más información se encuentra aquí ).
  • Una clave API SendGrid, que puede encontrar aquí . Si no está seguro de cómo crear una clave API, consulte la documentación
  • Un número Twilio con capacidad para SMS que puede obtener de la página Números de teléfono en la consola (lo más sencillo es utilizar un número de los EEUU para las pruebas)
  • Un dominio de subdominio dedicado donde pueda configurar registros MX, para permitir que SendGrid reciba correos electrónicos.
  • Una dirección de correo electrónico de destino para correos electrónicos entrantes.

Configuración de Zeit Now

Hay dos formas de implementar la solución en Zeit Now: Implementación rápida (Quick Deploy) o desde la línea de comandos. Quick Deploy es la manera más simple pero requiere una cuenta de GitHub. La línea de comandos requiere más configuración, pero le permite modificar y probar el código más fácilmente.

Implementación rápida

Para implementar la aplicación de muestra, primero debe asegurarse de que Zeit y Github estén vinculados. La forma más sencilla de hacerlo es ir a Su cuenta - Integraciones de Git  en Zeit y seguir las instrucciones para conectarse. Una vez conectado, haga clic en el botón a continuación o siga este enlace.

Deploy app button

Esto debería presentar una página "Create a new project" en Zeit, como se muestra a continuación. Para implementar, complete los valores del entorno que recopiló anteriormente.

Git crea un nuevo proyecto

Después de completar los detalles y presionar Deploy, finalmente se le presentará una pantalla como la que se muestra a continuación.

Implemente un proyecto git en Zeit

Para probar que todo se está cargando correctamente, copie en los dominios desde la pantalla y vaya a https: // <dominio> / api / index y debería obtener un "Hello World!". Ahora anote el dominio para más adelante, ya que lo necesitaremos en nuestras configuraciones Twilio y SendGrid para configurar los webhooks "When a Message Comes in" y "Inbound Parse".

Configuración de la línea de comando (CLI)

Si elige implementar desde la línea de comandos en lugar de utilizar el botón de implementación, los pasos son los siguientes:

npm i -g now
    now login

Configuración de Twilio

Configurar número de teléfono

Para asegurarnos de que los mensajes de texto entrantes se envíen como correos electrónicos, necesitaremos configurar nuestro número de teléfono que dirija la conexión a nuestra función. Para hacer esto, seleccione su número de teléfono en la página Active Numbers, confihure la sección de mensajes A Message Comes in   con Webhook y pegue:

<URL de implementación> / api / sms2email 

es decir, añada  /api/sms2email al final de su URL de implementación en la sección de webhook como se muestra a continuación.

Configurar un webhook de mensajería con Twilio

Configuración de SendGrid

Recepción de correo electrónico - Inbound Parse

Para recibir correos electrónicos, necesitamos configurar un Webhook Inbound Parse. Cuando esto esté configurado, SendGrid analizará el correo electrónico y sus archivos adjuntos y hará un POST hacia la URL especificada. En nuestro caso, vamos a especificar una URL de una función para poder procesar los correos electrónicos entrantes. Para procesar los correos electrónicos entrantes, debemos especificar un nombre de host dedicado a analizar los correos electrónicos entrantes, como parse.<yourdomain>.com  y actualizar los registros MX de este nombre de host para que apunten a mx.sendgrid.net. Esto suena complicado, pero afortunadamente, la documentación  que proporcionamos lo cubre. Establezca el dominio receptor hacia lo que seleccionó anteriormente y señale la URL de destino a <URL de implementación>/ api/email2sms

Agregue un webhook de análisis entrante con SendGrid

Tests con SMS y reenvío de correo electrónico

Para probar su implementación, primero envíe un SMS al número de teléfono Twilio que utilizó. En menos de un minuto, debería recibir un correo electrónico en la dirección de correo electrónico que especificó anteriormente. Puede responder directamente a este correo electrónico y, poco después, debería recibir un SMS desde el número de teléfono original. También puede enviar un SMS enviando un correo electrónico <número de teléfono e.164>@<dominio de correo electrónico> donde un número E.164  es el código del país más el número de teléfono sin ceros a la izquierda.

Cómo debuggar

Con suerte, todo funciona sin problemas. Pero si hay algún problema, diríjase a su Tablero de Zeit,  haga clic en el nombre de la implementación y vea los registros. Cualquier error de implementación y todo lo registrado en la consola debería aparecer aquí. Además, puede también mirar el debugger de Twilio, que muestra cualquier problema del lado Twilio con instrucciones sobre cómo resolverlo.

Reenvío de SMS y correo electrónico con Twilio

La solución que se muestra aquí es un enlace bidireccional simple entre una bandeja de entrada compartida y un número de teléfono Twilio. Esto se puede ampliar fácilmente para admitir asignaciones de múltiples bandejas de entrada a diferentes números de teléfono, aprovechando un array o una base de datos que asigne el número de teléfono de Twilio a la dirección de correo electrónico de su elección.

Traducción del post original por Ana Cristina Andrés del Valle. Puedes contactar con Ana en aandresdelvalle [at] twilio.com

Toby Allen es un arquitecto de soluciones de Twilio que trabaja con clientes en Australia. Ayuda a empresas a crear experiencias de usuario asegurándose de que se aprovecha toda la información contextual que tienen a mano. Ha trabajado en comunicaciones más de 15 años, desde el desarrollo de soluciones de video para empresas hasta ayudar a operadores a implementar soluciones de mensajería y voz de alcance mundial, incluyendo más de dos años trabajando comunicaciones en Cloud. Puede seguir a Toby en Twitter @tobyallen y LinkedIn .

Publicaciones relacionadas

Recursos relacionados

A newspaper article

Twilio Docs

Desde API hasta SDK y aplicaciones de muestra

Documentación de referencia de API, SDK, bibliotecas auxiliares, inicios rápidos y tutoriales para su idioma y plataforma.
An Open book

Centro de Recursos

Los últimos libros electrónicos, informes de la industria y seminarios web

Aprenda de los expertos en participación del cliente para mejorar su propia comunicación.
User group reactions

Ahoy

Centro de la comunidad de desarrolladores de Twilio

Mejores prácticas, ejemplos de códigos e inspiración para crear comunicaciones y experiencias de participación digital.