Crea un robot de SMS en Glitch con Hapi.js y la API de Messages API de Nexmo

El sitio Mensajes API de Nexmo le permite utilizar una única API para enviar mensajes a través de múltiples canales, como SMS, MMS y varias aplicaciones populares de chat social. Usted puede manejar los mensajes entrantes, decidir qué hacer con el contenido del mensaje, y enviar una respuesta en consecuencia. Esta entrada del blog tratará sobre cómo crear un bot sencillo que pueda contarte datos aleatorios sobre los Numbers.

Glitch es un entorno de desarrollo en línea que permite a los desarrolladores empezar a crear y desplegar sus aplicaciones sin las molestias de tener que configurar un servidor. Todas las aplicaciones de la plataforma pueden remezclarse y personalizarse, lo que la convierte en un lugar perfecto para compartir código y descubrir cómo funcionan las cosas.

Requisitos previos

Antes de comenzar este tutorial, sería útil poseer ya una comprensión básica de Javascript y Node.js.

Iniciar una aplicación Hapi.js en Glitch

Glitch está mejorando constantemente su interfaz y sus funciones, por lo que, en el momento de escribir estas líneas, puedes crear una nueva cuenta en Glitch haciendo clic en el botón Iniciar sesión en la esquina superior derecha de la página, y eligiendo Github o Facebook para iniciar sesión.

Create a new account on Glitch

A continuación, puede hacer clic en el botón Nuevo proyecto para empezar. Hay 3 opciones, hola-página-web, hola-express y hola-sqlite. Para los propósitos de este tutorial, utilice hello-express ya que esto le da un entorno con Node.js y npm ya instalado.

Click New Project button to get started

Para instalar paquetes de nodos adicionales, puede acceder a la línea de comandos pulsando el botón Consola en la ventana de estado.

Click Console button on Glitch status window

Puede alternar la ventana de estado haciendo clic en el botón Estado situado en la parte superior de la barra lateral. A partir de ahí, puedes utilizar todos los comandos CLI estándar en un entorno bash. La única diferencia es que en Glitch, usted usaría pnpm en lugar de npm.

Glitch utiliza Express como framework Node.js por defecto, pero al convertir la aplicación a Hapi.js no es demasiado complicado.

Click Status button near the top of the sidebar

Elimine express y body-parser del proyecto con el siguiente comando:

Instala Hapi.js con el siguiente comando:

La consola y el editor no se sincronizan automáticamente, así que ejecute el comando refresh para actualizar el archivo package.json en el editor.

Status of application shows an error

También observará que el estado de su aplicación muestra un error. Esto es de esperar porque el archivo server.js sigue haciendo referencia a express.

Para solucionarlo, sustituya el contenido de server.js por el siguiente código:

const Hapi = require('hapi');

// Create a server with a host and port
const server = Hapi.server({
  port: 8000
});

const init = async () => {
  // Add a basic route
  server.route({
    method: 'GET',
    path: '/',
    handler: function(request, h) {
      return 'hello world';
    }
  });
  
  // Start the server
  await server.start();
  console.log('Server running at:', server.info.uri);
};

init();

Ahora, cuando intentes ver tu aplicación, debería mostrarte una página en blanco con las palabras hola mundo.

Servir archivos estáticos

A pesar de que los mensajes se manejan en gran medida en el lado del servidor de las cosas, todavía sería bueno tener una página básica de aterrizaje de clases para su bot. Para ello, podemos servir una página HTML básica cuando la gente intente acceder a tu aplicación a través del navegador.

inerte es un plugin de gestión de archivos y directorios estáticos para hapi.js. Instálalo en tu proyecto a través de la consola con el siguiente comando:

pnpm install inert --save

Para hacer las cosas menos complicadas, coloque todos los archivos necesarios para la página de destino en la carpeta public carpeta. Puede mover el archivo index.html de la carpeta views a la carpeta public carpeta renombrando la ruta del archivo en la barra lateral.

Move files into public folder

También puedes hacerlo por línea de comandos a través de la consola.

Una vez hecho esto, modifica el archivo server.js para utilizar Inert y servir los archivos de la carpeta public de la siguiente manera:

const Hapi = require('hapi');
const Path = require('path');
const Inert = require('inert');

// Create a server with a host and port
const server = Hapi.server({
  port: 8000,
  routes: {
    files: {
      relativeTo: Path.join(__dirname, 'public')
    }
  }
});

const init = async () => {
  await server.register(Inert);

  // Add the route
  server.route({
    method: 'GET',
    path: '/{param*}',
    handler: {
      directory: {
        path: '.',
        redirectToSlash: true,
        index: true
      }
    }
  });
  
  // Start the server
  await server.start();
  console.log('Server running at:', server.info.uri);
};

init();

Ahora, en lugar de hola mundotu aplicación debería servir el archivo Glitch index.html por defecto. Eres libre de personalizar ese archivo como quieras.

Introducción a las API Nexmo

Vonage API Account

To complete this tutorial, you will need a Vonage API account. If you don’t have one already, you can sign up today and start building with free credit. Once you have an account, you can find your API Key and API Secret at the top of the Vonage API Dashboard.

This tutorial also uses a virtual phone number. To purchase one, go to Numbers > Buy Numbers and search for one that meets your needs.

Ready to start building?

Experience seamless connectivity, real-time messaging, and crystal-clear voice and video calls—all at your fingertips.

API credentials on the dashboard

Vuelve a tu aplicación Glitch e instala el cliente cliente Nexmo REST API para Node.js con el siguiente comando:

pnpm install nexmo@beta --save

Y si actualiza su proyecto, su package.json debería tener este aspecto:

Glitch status window

Ahora estás listo para empezar a construir tu propio bot. Este tutorial describe cómo construir un bot que devuelva trivialidades aleatorias sobre números, utilizando la NumbersAPIque es una API que devuelve datos interesantes sobre números. Pero eres libre de usar otras APIs para generar las respuestas de tu bot.

Envío y recepción de mensajes por SMS

Obtener un número de teléfono virtual

Para enviar y recibir SMS a través de la Messages API, también necesitará un número de teléfono virtualque es como cualquier número de teléfono normal, salvo que no está vinculado a ninguna línea telefónica física ni a ningún dispositivo.

Puede elegir un número local de un país de su elección, las funciones que admite y el tipo de número, ya sea móvil, fijo o gratuito.

Buy numbers

Una vez que tenga su número, aparecerá en la sección Tus Numbers sección. Haga clic en el icono del lápiz situado bajo el extremo derecho Gestionar para configurar la URL de tu webhook de entrada. Esto es necesario para recibir SMS. Cuando se envía un SMS a su número, se envía una solicitud POST se envía una solicitud a esta URL con la carga útil del mensaje.

inbound webhook URL

Creación de una aplicación Mensajes

A continuación, vaya a la sección Crear una aplicación en la sección Mensajes y envío en la barra lateral. Introduce el nombre de tu aplicación y las URL de los webhooks con la URL de tu aplicación de Glitch como host. También tendrás que generar un par de claves pública/privada, lo que te pedirá que descargues el archivo private.key archivo.

Generate key

A continuación, haga clic en el botón naranja Crear aplicación naranja. La siguiente pantalla le permitirá vincular su número virtual a su solicitud haciendo clic en el botón Vincular debajo del botón Gestionar Gestionar.

Create application

Por último, se le preguntará si desea vincular alguna cuenta externa, pero puede dejarlo por ahora.

Link any external accounts

Para subir el archivo private.key archivo a Glitch y mantenerlo en secreto, puede crear el archivo en una .data carpeta. El contenido de esta carpeta sólo será visible para ti y para los colaboradores de confianza que añadas al proyecto. Copia el contenido del archivo private.key que descargaste anteriormente en este nuevo archivo.

Private Key

Configuración de credenciales

Glitch admite variables de entorno a través del archivo .env que es una forma segura de almacenar tus credenciales API y otros datos privados para tu proyecto. Configura tu clave API, secreto, número virtual Nexmo, ID de la aplicación Messages y ruta de la clave privada en el archivo .env archivo.

Asegúrese de encerrarlos entre comillas, ya que cada valor debe ser una cadena. Haremos referencia a ellos para inicializar una nueva instancia de Nexmo, que utilizaremos para enviar mensajes SMS.

Set up .env file

Añade tus credenciales API al archivo server.js e inicialice una nueva instancia de Nexmo.

const NEXMO_API_KEY = process.env.NEXMO_API_KEY;
const NEXMO_API_SECRET = process.env.NEXMO_API_SECRET;
const NEXMO_APPLICATION_ID = process.env.NEXMO_APPLICATION_ID;
const NEXMO_APPLICATION_PRIVATE_KEY_PATH = process.env.NEXMO_APPLICATION_PRIVATE_KEY_PATH;
const NEXMO_NUMBER = process.env.NEXMO_NUMBER;

const Nexmo = require('nexmo');

const nexmo = new Nexmo({
  apiKey: NEXMO_API_KEY,
  apiSecret: NEXMO_API_SECRET,
  applicationId: NEXMO_APPLICATION_ID,
  privateKey: NEXMO_APPLICATION_PRIVATE_KEY_PATH
});

Recibir un SMS entrante

Para recibir un SMS entrante, tendrá que añadir una ruta para gestionar la solicitud entrante que se activa cuando alguien envía un SMS a su número virtual. POST entrante que se activa cuando alguien envía un SMS a su número virtual. Añade la siguiente ruta a tu archivo server.js archivo:

server.route({
  method: 'POST',
  path: '/inbound-sms',
  handler: (request, h) => {
    const payload = request.payload;
    console.log(payload);
    return h.response().code(200); 
  }
});

Tenga en cuenta que el parámetro path debe coincidir con la URL del webhook de entrada de tu número virtual, que configuraste anteriormente. Para asegurarte de que todo está bien conectado, envía un SMS a tu número virtual. Deberías ver la carga útil del mensaje impresa en la ventana de estado.

Message payload printed in the status window

Envío de una respuesta SMS saliente

Ahora tendrás que procesar la carga útil del mensaje extrayendo el contenido del mensaje y utilizándolo para recuperar un dato aleatorio de NumbersAPI. Puedes escribir una función que compruebe si el contenido del SMS es un número; si no, puedes devolver una respuesta que pregunte por un número.

function parseSms(payload) {
  const message = payload.text;
  const phone = payload.msisdn;
  
  const isNum = /^\d+$/.test(message);
  console.log(isNum);
  
  if (isNum) {
    getFactSms(message, phone);
  } else {
    smsResponse("Sorry, but Numbot can only give you facts about whole numbers. Try something like 42.", phone);
  }
}

Sustituya la línea que dice console.log(payload) con una llamada a su nueva función parseSms() función. Notarás que si el contenido del mensaje es un número, estoy llamando a otra función llamada getFactSms(). Esta será la función que llame a la API de Numbers para el dato aleatorio que enviará de vuelta a su usuario.

Para ello, tendrá que hacer una GET básica. Hay varias bibliotecas que pueden hacerlo, pero dado que se trata de una petición relativamente sencilla, puedes utilizar el módulo nativo de Node.js http módulo .

const http = require('http');

function getFactSms(number, phone) {
  return http.get(
    {
      host: 'numbersapi.com',
      path: '/' + number
    },
    function(response) {
      let fact = '';
      response.on('data', function(d) {
        fact += d;
      });
      response.on('end', function() {
        smsResponse(fact, phone);
      });
    }
  );
}

La última función smsResponse() activará el envío del dato aleatorio a tu usuario.

function smsResponse(fact, phone) {
  nexmo.channel.send(
    { "type": "sms", "number": phone },
    { "type": "sms", "number": NEXMO_NUMBER },
    {
      "content": {
        "type": "text",
        "text": fact
      }
    },
    (err, data) => { console.log(data.message_uuid); }
  )
}

Y ya está. Ya tienes un bot SMS básico que responde con datos aleatorios sobre el número que le envíes.