Crea un bot en Facebook con IBM Watson Assistant

Publicado por Danilo Toro en

Imagen representativa de un chatbot

En este post, voy a explicar como crear un bot en el Rey de las redes sociales, si, hoy explicaré como se crea un bot en Facebook.

Al igual que los tutoriales donde explico Cómo crear un bot en Telegram, utilizaré los servicios de IBM, así que necesitarás tener una cuenta en IBM Cloud. Prepárate! Porque el post es laaargo.

Pre requisitos

  • Tener una página en Facebook (obligatorio)
  • Contar con el servicio de Watson Assistant y Node-Red (obligatorio)
  • Realizar los dos tutoriales anteriores. Tutorial 1, Tutorial 2 (recomendado)

Credenciales de Facebook Messenger

El primer paso para crear nuestro bot en Facebook es obtener las credenciales de Facebook Messenger. Para esto, tenemos que generar y verificar un token de acceso a nuestra página que servirá para verificar nuestra identidad al publicar en Messenger.

En la página de Facebook para desarrolladores, hacemos click en Start building

Luego en Configura tu aplicación

Como nos dice Facebook, antes de empezar tenemos que tener creadas algunas cosas. Lo primero que debemos tener, aparte de una página de Facebook, es una cuenta de desarrollador de Facebook.

Vamos a Facebook Developers y hacemos click en Mis aplicaciones y luego en Crear una aplicación.

Acá podrás ver todas tus aplicaciones creadas

En el formulario Crear un nuevo identificador de la app, colocar un no,bre para tu aplicación y un correo electrónico. Yo le pondré “Perita” porque usare mi página Pear de un proyecto que tuve. Click en Crear identificador de la app

Ahora que tenemos nuestra aplicación creada, debemos agregar el producto que queremos usar, en nuestro caso, Messenger. Clickeamos en Configurar.

Bajamos hasta la sección, Tokens de acceso, y presionamos Agregar o eliminar página.

Se abrirá otra ventana donde después de logearte con tu cuenta de Facebook, te pedirá seleccionar la página que quieres controlar. Presionamos Siguiente, luego Listo y Aceptar. Si aún no tienes creada tu página, deberás hacer click en Crear nueva página.

De vuelta en la página de desarrolladores, hacemos click en Generar token y damos click en Acepto, y Facebook nos entregará un Token. Es importante anotarlo ya que lo usaremos más adelante.

Crear webhook en Node-Red

Ya tenemos lista la configuración de la página, ahora debemos crear la conexión con NodeRed.

Nota: Si no sabes como crear un Node-Red, puedes aprenderlo aquí. También puedes obtener el flujo de Node-Red, completo en mi Github

En la sección Webhooks, haremos click en Agregar URL de devolución de llamada. En la ventana que nos aparecerá completamos los siguiente:

  • Url de devolución de llamada: Colocaremos la url de nuestro nodered más /fbot.
  • Verificar token: Cualquier palabra o frase que se te ocurra para ser usada como token.
Facebook Webhook

Antes de presionar Verificar y guardar debemos crear nuestro callback. Para esto vamos a nuestro Node-Red y creamos los siguientes nodos:

  • http de la sección input
  • http response de la sección output
  • function de la sección function
  • debug de la sección output

Nota: Hay algunas versiones diferentes de Node-Red con los nodos distribuidos de diferente formas, como la sección common o network, pero los nodos son los mismos. Puedes usar el filtro para buscar los nodos con más facilidad.

El nodo http, lo configuramos de la siguiente forma:

  • Method: GET
  • URL: /fbot o la palabra que quieras
  • Name: Un nombre para el nodo

Al nodo function le agregamos el siguiente código:

Unimos los nodos y hacemos deploy

Ahora podemos volver a la página de Facebook Developers y hacer click en Verificar y guardar. Deberías ver lo siguiente:

Lo ultimo que nos falta es agregar nuestras suscripciones. Para eso hacemos click en Agregar suscripciones y hacemos click en Messages y luego en guardar.

Escuchando y respondiendo en Messenger

Ya tenemos lista la conexión entre nuestra página de Facebook y Node-Red. Ahora nos queda recibir y enviar información en Messenger.

Recibiendo mensajes

Para escuchar los mensajes que llegan a nuestro chat, crearemos el siguiente flujo.

El nodo http input, lo configuramos así:

El nodo function debe tener el siguiente código:

Lo que hará nuestra función será encontrar cada mensaje. En la primera salida, retornará un objeto msg del cual leeremos el mensaje y en la segunda retornará null, para cerrar la conexión http.

Al nodo debug conectado a la función, le cambiaremos la configuración por defecto. No queremos leer el payload, sino el messaginEvent, por lo cual cambiaremos el Output a messagingEvent.

Hacemos deploy. deberás tener algo así

Ya deberíamos poder recibir mensajes, así que vamos a nuestra página y cambiamos a Ver como visitante de la página.

Mandamos un mensaje, y en la pestaña debug deberíamos ver algo así:

El primer mensaje es el que obtiene el primer debug, y nos entrega toda la información proveniente de Facebook, el segundo mensaje es el que nos entrega el segundo debug y solo contiene la información del mensaje. Quien lo envía, quien recibe y el mensaje en sí.

Nuestro bot ya puede oir los mensajes, ahora solo nos falta responder. El encargado de responder los mensajes será Watson Assistant, por lo que, si no tienes creado un diálogo, te recomiendo que primero veas aquí antes de continuar.

Respondiendo mensajes

Igual como lo hicimos con Telegram, usaremos un nodo especial para enviar la información a Messenger, llamado Messenger-writer.

Para instalarlo vamos al Manage Palette, que se encuentra en el Menú

En la pestaña Install, buscamos Messenger-writer y hacemos click en Install. Si la instalación fue correcta, encontrarás el nodo en la barra de nodos del sector izquierdo.

Para configurar el nodo y pueda enviar mensajes a Facebook, le hacemos click al nodo y escribimos el token que nos entrego Facebook.

Si vemos la documentación del nodo, nos dice que requiere que el mensaje tenga dos atributos, payload y facebookevent.

  • msg.payload: Es el mensaje que se quiere enviar. Será proveniente de Watson.
  • msg.facebookevent: Es el mensaje que obtenemos de facebook, que filtramos en nuestra función.

Sabiendo lo anterior, necesitaremos algunos nodos extras. Lo primero que haremos será reutilizar la estructura que creamos en el segundo tutorial de telegram, y así nuestro bot puede funcionar tanto para Telegram como para Facebook. Nota: Si no tienes el flujo, puedes acceder a el aquí. Tendrás el Node-Red completo si descargar el archivo Node-Red-Bots.json

Lo que nos interesa es cambiar de lugar los nodos que se encargan de la lógica del Assistant, para tener separado Watson Assistant, Facebook y Telegram. Para esto, seleccionamos lo que ves en la imagen de abajo y lo pegamos en una nueva pestaña.

Para crear una nueva pestaña, haz click en el boton “+”. Puedes cambiar el nombre de la pestaña , Flow 4, en mi caso, haciendo doble click sobre ella.

Ahora que tenemos el flujo del Assistant, arrastramos al flujo dos nodos nuevos. Link in y Link out. Estos nodos nos servirán para conectar flujos entre dos pestañas.

En la pstaña donde tenemos nuestra lógica para Facebook, debemos tener algo asi:

En el nodo function FB_to_Watson, agregará un atributo channel igual a “Facebook” y agregará al payload, el texto que proviene de Facebook. Así que anotamos los siguientes códigos para el nodo FB_to_Watson y el nodo Watson_to_FB:

Al nodo Link in, le colocamos el nombre Facebook, para luego poder unirlo con el nodo link out, que viene desde la pestaña Watson Assisntant.

En la pestaña de Watson Assistant, debes tener algo así:

El nodo switch, nos ayudará a diferenciar si el canal es Facebook u otro. (puedes agregar más opciones como Slack, Twitter, entre otros.)

El nodo function Watson_to_FB, agregará a msg.payload, la respuesta de Watson Assistant. Escribiremos lo siguiente:

Al nodo link in, le pondremos como nombre Watson, y en el nodo link out, conectado a Watson_to_FB, lo conectamos a Facebook.

Como nuestro nodo link in ahora tiene nombre (Watson), volvemos a la pestaña de Facebook, y al nodo link out conectada a la función FB_to_Watson, lo conectamos a Watson


Listo! Ya tenemos nuestro Bot para Facebook.

Espero no se sienta tan largo el post. Si te interesa aprender como hacer un CallBot o si quieres que tu bot funcione en otras plataformas, puedes decírmelo en los comentarios 😉.

Repositorio: https://github.com/DaniloToroL/Blog-Nodered


0 comentarios

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *