Alojar tu agente

El último paso de este tutorial es alojar tu agente de Dialogflow. App Engine se usa para el alojamiento, ya que es fácil de configurar y se adapta bien. La integración de Dialogflow Messenger se usa para la interfaz de usuario de un agente.

Configuración del proyecto

Lo ideal es que tu agente de Dialogflow y la instancia de App Engine estén en el mismo proyecto. Además, debes habilitar la API Cloud Build.

  1. Antes de crear la instancia, selecciona tu proyecto en la Google Cloud consola.

    Ir al selector de proyectos

  2. Habilita la API de Cloud Build en el proyecto.

    Habilitar la API Cloud Build

Configuración del entorno

Para desarrollar una aplicación de Go para App Engine, debes instalar y configurar algunos elementos. Sigue los pasos que aún no hayas completado en Configurar un entorno de desarrollo.

Crear el código del servicio web

El código de ejemplo de este tutorial está escrito en Go, pero puedes usar cualquier lenguaje compatible con App Engine. Crea la siguiente estructura de archivos en cualquier lugar de tu máquina local:

  • go-app/: directorio de tu servicio de Go.
    • templates/: directorio de tus plantillas HTML de Go.
      • index.html: plantilla HTML de Go.
    • app.yaml: los ajustes de configuración de tu servicio.
    • main.go: el código de tu aplicación.

En las tres secciones siguientes se proporciona el contenido de los tres archivos.

Contenido del archivo index.html

Este archivo de plantilla HTML de Go contiene el código HTML de la página principal. Rellena este archivo con el siguiente contenido:

<!DOCTYPE html>
<html lang="en-US">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>Tutorial agent</title>
  </head>
  <body>
    <p>Open the chat window in the bottom right corner.</p>
  </body>
</html>

Contenido del archivo app.yaml

Se trata de un archivo de configuración que especifica los ajustes del entorno de ejecución de tu servicio. Puedes consultar el documento sobre el entorno de ejecución de Go 1.12 y versiones posteriores para ver la lista de versiones de Go compatibles. Rellena este archivo con el siguiente contenido:

runtime: go116  # or another supported version

Contenido del archivo main.go

Este archivo contiene el código de tu aplicación. Rellena este archivo con el siguiente contenido:

// Package main is the main package
package main

import (
	"log"
	"net/http"
	"os"
	"text/template"
)

var templates *template.Template

func init() {
	templates = template.Must(template.New("").ParseGlob("templates/*"))
}

// indexHandler handles the homepage.
func indexHandler(w http.ResponseWriter, r *http.Request) {
	if r.URL.Path != "/" {
		http.NotFound(w, r)
		return
	}
	if err := templates.ExecuteTemplate(w, "index.html", nil); err != nil {
		log.Fatal(err)
	}
}

func main() {
	// Register the handlers
	http.HandleFunc("/", indexHandler)

	port := os.Getenv("PORT")
	if port == "" {
		port = "8080"
		log.Printf("Defaulting to port %s", port)
	}

	log.Printf("Listening on port %s", port)
	if err := http.ListenAndServe(":"+port, nil); err != nil {
		log.Fatal(err)
	}
}

Desplegar un servicio web

Tu código ya está listo para implementarse. En estos pasos se usa la herramienta gcloud para la implementación:

  1. Asegúrate de que gcloud esté configurado con el mismo proyecto que tu agente de Dialogflow. Para comprobar el proyecto, sigue estos pasos:

    gcloud config get-value project

    Para cambiar de proyecto, sigue estos pasos:

    gcloud config set project YOUR_PROJECT
  2. En el directorio go-app donde se encuentra el archivo app.yaml, despliega tu servicio web en App Engine con el siguiente comando:

    gcloud app deploy

    El comando te pedirá que elijas una región. Asegúrate de seleccionar la misma región que tu agente de Dialogflow. El comando mostrará el valor target url, que es la URL de tu servicio web.

  3. Para iniciar el navegador y ver el servicio web, puedes abrir la URL de destino del paso anterior o ejecutar el siguiente comando:

    gcloud app browse

Configurar Dialogflow Messenger

Para configurar y habilitar Dialogflow Messenger, sigue estos pasos:

  1. Ve a la consola de Dialogflow ES.
  2. En el menú de la barra lateral de la izquierda, haz clic en Integraciones.
  3. Haz clic en Dialogflow Messenger.
  4. Se abrirá un cuadro de diálogo de configuración.
  5. Elige un entorno.
  6. Haz clic en Enable (Habilitar).
  7. Copia el código de inserción para pegarlo en tu sitio web.
  8. Haz clic en Cerrar.

Insertar el agente en tu servicio web

Pega el código insertado que has copiado arriba en tu archivo index.html. Los elementos HTML <script> y <df-messenger> deben estar en el elemento <body> de tu página.

Vuelve a desplegar tu aplicación de servicio web con gcloud. Una vez implementado, puedes interactuar con tu agente a través de la página web haciendo clic en el icono de chat de la esquina inferior derecha.

Captura de pantalla de un agente de Dialogflow insertado en una página web

Ya tienes un agente de Dialogflow totalmente implementado. Prueba a mantener una conversación con el agente.

Limpieza

Durante los pasos de este tutorial, has creado recursos facturables. Para evitar que se apliquen cargos adicionales en tu cuenta de Google Cloud, haz lo siguiente:

  1. Elimina la instancia de base de datos.
  2. Elimina la función:

    gcloud functions delete tutorial-telecommunications-webhook
  3. Inhabilita tu aplicación.

  4. Eliminar un agente

Más información

Para obtener más información sobre los pasos anteriores, consulta los siguientes artículos: