Microsoft Bot Framework, .NET y Microsoft Azure App Service

Desde hace ya tiempo quería contarte lo fácil que resulta hoy en día crear tus propios bots con Microsoft Bot Framework, el cual te permite adentrarte en este mundo con las herramientas que ya conoces. En este post quiero mostrarte además cómo este servicio puede apoyarse en Microsoft Azure como lugar para alojar tus bots y conseguir que este proceso sea aún más fácil.

Lo primero que debes hacer es descargarte un nuevo tipo de proyecto para Visual Studio. La plantilla puedes descargarla directamente desde este enlace y debes ubicarla tal cual en %USERPROFILE%\Documents\Visual Studio 2015\Templates\ProjectTemplates\Visual C#

Bot Application - Visual Studio Template - Explorer

Una vez hecho esto, ya deberías de ser capaz de crear proyectos de tipo Bot Application.

Bot Application - Visual Studio
Bot Application – Visual Studio

Como puedes ver, no son más que una aplicación ASP.NET MVC Api que contiene un controlador con una acción Post, la cual recibe los mensajes que el usuario envia al bot.

BotApp - Solution Explorer
BotApp – Solution Explorer

El ejemplo que viene por defecto es bastante básico, ya que sólo cuenta el numero de letras recibidos en el mensaje del usuario, pero te permitirá conocer todo el proceso desde que lo creas, lo despliegas y lo registras dentro de la plataforma.

Si ejecutas el proyecto, verás en el navegador la siguiente información:

BotApp browser
BotApp browser

Lo primero que aparece son las condiciones de uso que puedes redactar en el archivo default.htm de tu proyecto. Después se muestra el enlace donde puedes registrar tu bot, que te permitirá conectar el mismo con diferentes canales (chat web, Telegram, SMS, Skype, etc.). Por último puedes ver cuál es la URL por convención que debes utilizar para hacer llamadas a tu bot.

Antes de desplegarlo, es muy útil que pruebes el emulador de bots. Se trata de una aplicación de escritorio para Windows que podrás utilizar a modo de chat con el fin de comprobar que todo funciona correctamente. Puedes descargarlo desde el desde aquí. Los valores por defecto de la plantilla de Visual Studio estarán configurados en la parte superior del emulador.

Microsoft Bot Framework Emulator
Microsoft Bot Framework Emulator

Si ya has comprobado que todo funciona correctamente es el momento de publicar tu nuevo bot en Internet. Uno de los servicios que puedes utilizar para ello es App Service – API Apps. Para ello basta con hacer clic con el botón derecho sobre el proyecto > Publish y seleccionar la opción Microsoft Azure App Service.

Publish Web - Microsoft Azure App Service
Publish Web – Microsoft Azure App Service

Crea una nueva API App a través del asistente y publica el código fuente. Puedes modifcar el emulador con la URL de tu nueva API App para comprobar que todo funciona correctamente.

MS Bot Fw Emulator - API App
MS Bot Fw Emulator – API App

El último paso de este post es registrar tu nuevo bot dentro de la plataforma, con el fin de poder integrarlo con otros servicios. Antes de registrarlo debes cambiar el App ID en el archivo Web.config de la aplicación. Después accede a https://dev.botframework.com/bots/new y rellena el formulario con los datos del servicio. Los valores más importantes son el Endpoint ya que apunta a la URL donde está ejecutandose tu bot, en este caso la API App que acabas de crear.

Register a bot - Endpoint
Register a bot – Endpoint

y App ID del servicio que acabas de cambiar en el archivo de configuración de la aplicación.

Register a bot - App ID
Register a bot – App ID

Una vez generado el bot copia la primary app secret y actualiza el archivo web.config con la misma y despliega de nuevo la solución en tu API App.

BotApp - Primary app secret
BotApp – Primary app secret

Antes de despedirnos vamos a probar que nuestro bot es capaz de integrarse con uno de los canales que ofrece la plataforma, el Web Chat. Haz clic en la opción Get bot embed codes para recuperar el código HTML necesario para embeber un chat preconfigurado con tu bot.

BotApp - Get bot embed codes
BotApp – Get bot embed codes

En ese enlace serás capaz de recuperar un iframe y la clave necesaria para tener acceso al servicio. Para este ejemplo he copiado el mismo en una aplicación web como la siguiente:

<!DOCTYPE html>
<html>
<head>
    <title></title>
<meta charset="utf-8" />
</head>
<body>
    <iframe src="https://webchat.botframework.com/embed/botappgis?s=quhh3XVTk04.cwA.HAs.8-xPubLbPp-IiGPG9CEu3-Pw3Z7dZL8k82ZFex1Hy2M" style="height: 502px; max-height: 502px;"></iframe>
</body>
</html>

Si ejecutas el código podrás comprar que tu bot se integra correctamente con este canal y habrás completado el ciclo desde la creación, despliegue e integración con canales.

Web application - WebChat
Web application – Web Chat

¡Saludos!