Aprende a consumir una API desde tu Alexa Skill con este sencillo tutorial.

1. Ing. Vicente G. Guzmán Lucio
Como consumir un servicio externo con Axios en Alexa
A veces, podemos encontrarnos con una situación en la que se necesita interactuar con
servicios externos, y es que sabemos que es necesario en cualquier desarrollo. Estos pueden
ser, por ejemplo, un servicio para obtener información meteorológica, noticias locales o,
incluso, configurar un servicio privado para interactuar con dispositivos IoT. Básicamente,
cualquier cosa con la que pueda interactuar a través de HTTP.
Por ello, en este articulo aprenderemos sobre cómo podemos interactuar con APIs externas
en una Skill de Alexa. En el ejemplo vamos a implementar una Skill que proporcione
información con respecto a cargadores eléctricos de carros.
Flujo: Le solicitamos a Alexa una estación eléctrica, esta obtendrá aleatoriamente de una
API y nos devolverá los datos correspondientes que tiene el servicio.
Comencemos
El primer paso por realizar será el de crear una Skill en la developer console de Amazon
Alexa. Este ejemplo llevara por nombre: Find ChargerCar (recordemos que el nombre de la
skill NO es necesariamente es el mismo con el que los usuarios accederán a la misma, puesto
que este puede ser editado (cambiado)).
El modelo que seleccionaremos será el de Custom y el método que elegiremos con respecto
a nuestro back-end será el de Provision your own, tal y como se muestra a continuación.
* Nota: En este ejemplo y por cuestiones practicas se manejó el lenguaje English (US).

2. Ing. Vicente G. Guzmán Lucio
Posteriormente seleccionamos la plantilla de Fact Skill

3. Ing. Vicente G. Guzmán Lucio
Una vez cargado la vista, del lado izquierdo visualizaremos que tenemos un Intent, el cual
se genero de manera automática, lo que haremos será cambiarle el nombre por el de:
GetChargerIntent y eliminaremos todos sus Utterances, puesto que añadiremos los
siguientes: chargers, give me options of chargers.
Guardemos y construyamos nuestro modelo.
De igual manera editemos nuestro nombre de invocación, puesto que él que se genero fue
el de “space facts”, cambiémoslo por el de: charger car. Y al igual que el paso anterior,
guardemos y construyamos nuestro modelo.
Después nos dirigimos al portal de AWS, en donde buscaremos el servicio Lambda.
Al seleccionarla, se nos dará la opción de generar una nueva función, en la ventana siguiente
escojamos la plantilla: Crear desde cero.
Brindémosle un nombre como: lambdaChargerCar; En Tiempo de ejecución dejémoslo en
Node.js 10.x - después culminemos con el botón que se encuentra en la parte inferior
derecha: Crear una función.
Cuando termine de haberse creado, tendremos una vista similar a esta:

4. Ing. Vicente G. Guzmán Lucio
Lo primero que haremos será agregar un desencadenador, el cual al dar clic y desplegarnos
otra vista, deberemos de buscar en el listado la opción de: Alexa Skills Kit
Al hacer esto nos solicita ingresar (o pegar) él ID de la Skill que anteriormente generamos.
Si no sabemos de donde proviene este, solo debemos de regresar al portal de alexa
developer console y debajo de donde se encuentra el nombre de nuestra Skill esta la
leyenda View Skill ID, al darle clic veremos dicho valor, este siempre iniciara con las letras:
amzn.ask, entonces, solo seleccionémoslo y añadámoslo en la parte indicada del
desencadenador y demos clic en el botón Agregar.

5. Ing. Vicente G. Guzmán Lucio
Al hacerlo nuestra vista queda de la siguiente manera:
Después deberemos de añadir una capa, esto dando clic en Layers. Al hacerlo, en la parte
inferior nos aparecerá un botón con la leyenda “Añadir una capa”, este nos abrirá una
nueva vista en donde solamente deberemos de seleccionar el nombre y la versión, como a
continuación podemos ver:
Una vez añadida la capa, posicionémonos en la función (lambdaChargerCar) y al recorrer
hacia abajo podemos observar que existe un archivo index.js, este ahorita pasaremos a
modificarlo, pero antes deberemos de trabajar de manera local, en donde en nuestro
respectivo equipo deberemos de crear una carpeta (recomiendo una donde recuerden
todos sus proyectos), la cual contendrá nuestros archivos y el paquete que nos permitirá
consumir el servicio.
En mi caso le puse por nombre a la carpeta ChargerCar, y dentro de ella generé otra
denominada lambda.

6. Ing. Vicente G. Guzmán Lucio
Una vez hecho esto vayamos a esta ruta mediante la terminal e instalemos el paquete Axios
con el siguiente comando: npm install axios
Al terminar, nos habrá generado una carpeta denominada node_modules y un archivo
package-lock.json, seleccionémoslos y comprimámoslos, de tal manera que nos genere un
archivo .zip como a continuación podemos observar:
Regresemos a nuestra función lambda en AWS, y en la sección de Código de la función,
cambiemos el tipo de entrada de código por el de Cargar un archivo.zip

7. Ing. Vicente G. Guzmán Lucio
Al hacer esto, deberemos de cargar el paquete que generamos con anterioridad
(Archivo.zip), posteriormente damos en el botón Guardar.
Si observamos con detenimiento, el archivo index.js desapareció de la estructura y este
aparece de la siguiente manera:
Ahora lo que deberemos de hacer es crear el archivo antes mencionado y otro llamado
package.json, para esto solo posicionémonos en la carpeta raíz, y demos clic derecho –
New File

8. Ing. Vicente G. Guzmán Lucio
Y en cada uno, peguemos el código correspondiente que les comparto a continuación:
index.js – package.json
index.js
La variable constante chargersUrl es igual al servicio externo, el cual es el que contiene la
información que le haremos saber a nuestros usuarios, por ende, si se desea cambiarlo por
el propio, solo deberán de respetar los elementos que contenga el json.
En el mismo archivo podemos ver que existe un manejador denominado
GetChargerIntentHandler, el cual llama al Intent que modificamos en nuestro Front:
GetChargerIntent. En este se encuentra la lógica de extracción de datos del servicio, a los
cuales accedemos mediante una variable constante llamada ecar y posteriormente lo
regresamos con la información obtenida.

9. Ing. Vicente G. Guzmán Lucio
package.json

10. Ing. Vicente G. Guzmán Lucio
Vista Previa
Ya para finalizar deberemos de enlazar nuestra lambda con nuestra Skill, para esto en la
parte superior derecha se encuentra nuestro ARN (Amazon Resource Name), este
deberemos de copiarlo para pegarlo en nuestro Endpoint, que se encuentra en el portal de
alexa developer console.
Una vez hecho esto, guardemos y construyamos nuestra Skill, y comprobemos que
funciona yendo a la pestaña de Test e invocando a la misma con el nombre que le
asignamos previamente.

11. Ing. Vicente G. Guzmán Lucio
Con esto terminamos, ¿te gustó? Si es así te invito a que te suscribas y compartas con tus
amigos este material, recuerda que así logras que la comunidad de desarrolladores en
español crezca.
Y como siempre a continuación dejo el código completo en mi GitHub de lo que se vio en
este pequeño tutorial, recuerda que de igual manera te puedes unir a la comunidad en
Facebook.
¡Happy Coding!