Compila una app de Google Chat para Dialogflow CX que comprenda y responda con lenguaje natural

En esta página, se explica cómo compilar una app de Google Chat que pueda comprender y responder con lenguaje natural mediante Dialogflow En esta guía, se utiliza Dialogflow CX, que tiene una integración directa con Google Chat. También puedes usar Dialogflow ES para crear un App de Google Chat para Dialogflow ES siguiendo los pasos que se indican a continuación el Google Chat sobre Dialogflow ES .

Por ejemplo, piensa en una app de Chat que ayude a las personas a alquilar automóviles. Un usuario podría escribir: "Me gustaría alquilar un auto". El La app de Chat podría responder con una pregunta como "¿Dónde quieres retirar el vehículo?" que da comienzo a una situación individual con el usuario, en la que la app de Chat comprende y responde con la voz humana a la hora de reservar el alquiler de un automóvil.

Este es solo un ejemplo. Las apps de Chat de Dialogflow son útiles en todas tipos de interacciones. Si requiere la voz humana natural, App de Chat de Dialogflow. El agentes compilados previamente ayudarte a comenzar rápido y demostrar lo que Dialogflow puede hacer, por ejemplo:

• Reservar vuelos
• Programar citas médicas
• Pide comida con entrega a domicilio
• Responde preguntas sobre un catálogo de productos de venta minorista, por ejemplo, si los artículos están disponibles en otros colores.

• 

  Figura 1: Selección de un agente compilado previamente para una app de Dialogflow Chat.

• 
  Figura 2: Probar el agente en Dialogflow CX para asegurarte de que la lógica y la configuración del agente funcionen según lo previsto. En el diagrama, se muestra un conjunto secuencial de páginas temáticas que abordan pasos específicos de la conversación, como establecer una ubicación de partida y devolución para un auto alquilado, y configura la lógica que las conecta. La conversación se prueba en un simulador.
• 
  Figura 3: Configurar una app de Chat para procesar respuestas con el agente de Dialogflow CX en la página de configuración de la API de Chat en la consola de Google Cloud
• 
  Figura 4: Conversar sobre reservar un auto de alquiler con la app de Dialogflow Chat en Google Chat

Objetivos

• Configurar el entorno
• Crear e implementar un agente de Dialogflow CX
• Crea e implementa una app de Chat con la tecnología de Agente de Dialogflow CX.
• Prueba la app de Chat.

Requisitos previos

• Una empresa o empresa de Google Workspace con acceso a Google Chat.
• Un proyecto de Google Cloud con facturación habilitada. Para verificar que un proyecto existente tenga habilitada la facturación, consulta Verifica el y el estado de facturación de tus proyectos. Para crear un proyecto y configurar la facturación, consulta Crea un proyecto de Google Cloud.

Arquitectura

En el siguiente diagrama, se muestra la arquitectura de una App de Chat compilada con Dialogflow:

En el diagrama anterior, un usuario que interactúa con Dialogflow La app de Chat tiene el siguiente flujo de información:

1. Un usuario envía un mensaje en Chat a un App de Chat, ya sea en un mensaje directo o en Espacio de Chat
2. Un agente virtual de Dialogflow, que reside en Google Cloud, recibe y procesa el mensaje para producir una respuesta.
3. De manera opcional, con un Webhook de Dialogflow, el agente de Dialogflow puede interactuar con servicios externos de terceros, como como un sistema de gestión de proyectos o una herramienta de generación de tickets.
4. El agente de Dialogflow envía una respuesta al Servicio de la app de Chat en Chat.
5. La respuesta se entrega al espacio de Chat.

Configura el entorno

Antes de usar las APIs de Google, debes activarlas en un proyecto de Google Cloud. Puedes activar una o más APIs en un solo proyecto de Google Cloud.

1. En la consola de Google Cloud, habilita la API de Google Chat y la API de Dialogflow.

   Habilitar las API

2. Confirma que estás habilitando las APIs en la ubicación correcta de Google Cloud y haz clic en Siguiente.

3. Confirma que estás habilitando las APIs correctas y, luego, haz clic en Habilitar.

Crear un agente de Dialogflow CX

R Agente de Dialogflow CX es un agente virtual que controla conversaciones simultáneas con los usuarios finales. Es un módulo de comprensión de lenguaje natural comprende los matices del lenguaje humano. Dialogflow traduce el texto del usuario final durante una conversación a los datos estructurados que tus apps y servicios puedan entender. Diseñarás y crearás un agente de Dialogflow para manejar los tipos de conversaciones necesarias para tu sistema.

Un agente de Dialogflow es como un agente humano de un centro de atención telefónica. Los entrenas a ambos para manejar las situaciones de conversación esperadas, y tu entrenamiento no tiene que ser demasiado explícito.

A continuación, se muestra cómo crear el agente de Dialogflow CX:

1. En la consola de Dialogflow CX, abre la consola de Dialogflow CX. Haz clic en Menú > Dialogflow CX.

   Ir a la consola de Dialogflow CX

2. Elige un proyecto de Google Cloud. Para encontrar tu proyecto, es posible que debas haz clic en Todos y búscalo.

3. Ahora tienes la opción de elegir un agente precompilado o tú mismo. Si prefieres explorar personalización más adelante, elige uno de los agentes compilados previamente, que también son útiles para aprender lo que pueden hacer los agentes.

   Para elegir un agente compilado previamente, sigue estos pasos:

   1. Haz clic en Usar agentes compilados previamente.

   2. Selecciona un agente compilado previamente. Para esta guía, selecciona Viajes: Alquiler de automóviles

      Los agentes están clasificados como principiantes, intermedias o avanzadas según la cantidad de funciones que use el agente y en la sofisticación de su lógica de conversación. Elegir un puede que el agente intermedio o avanzado requiera que un agente personalizaciones y parámetros de configuración, incluida la habilitación de funciones y APIs en Consola de Google Cloud

   3. Haz clic en Importar como agente (Import as agent).

   Para crear tu propio agente, sigue estos pasos:

   1. Haz clic en Create Agent.
   2. Selecciona Generar automáticamente para crear un agente del almacén de datos o selecciona Crea uno propio para crear otros tipos de agentes.

   Para obtener una explicación detallada del proceso de compilación del agente, consulta Crea un agente de Dialogflow CX.

4. Establece la configuración básica del agente:

   1. En Nombre visible, ingresa un nombre visible.
   2. Selecciona tu ubicación preferida. Si quieres cambiar la configuración la configuración de la ubicación, Haz clic en Editar.
   3. Selecciona tu zona horaria preferida.
   4. Selecciona el idioma predeterminado para tu agente. No puedes cambiar el idioma predeterminado de un agente después de su creación.

5. Haz clic en Crear. Dialogflow CX comienza a crear el agente y, luego, muestra el flujo de inicio predeterminado del agente.

6. De manera opcional, personaliza el agente. Para obtener una explicación detallada, el proceso de personalización, consulta Crea un agente de Dialogflow CX.

7. Como práctica recomendada, prueba el agente:

   1. Haz clic en Test agent.
   2. Selecciona Probar el agente en el entorno.
   3. En Entorno, selecciona Borrador.
   4. En Flow, selecciona Default Start Flow.
   5. En Página, selecciona Página de inicio.
   6. En la barra de redacción Hablar con el agente, escribe Hello y presiona Intro. El agente responde presentándose a sí mismo.
   7. Completa la prueba con la conversación de prueba de muestra.

8. Se crea el agente de Dialogflow CX. Regresa a la consola de Dialogflow CX. Haz clic en Menú . > Dialogflow CX.

   Ir a la consola de Dialogflow CX

9. En Agentes, haz clic en . > Copiar nombre. Guardar este nombre como la usarás cuando configures la app de Chat.

Crea una app de Chat y conéctala con el agente de Dialogflow

Después de crear un agente de Dialogflow CX, sigue estos pasos para convertirlo en una App de Chat:

1. En la consola de Google Cloud, ve a la API de Google Chat. Busca “API de Google Chat” y Haz clic en API de Google Chat y, luego, en Administrar.

   Ir a la API de Chat

2. Haz clic en Configuración y configura la app de Chat:

   1. En Nombre de la app, ingresa Dialogflow App.
   2. En URL del avatar, ingresa https://developers.google.com/workspace/chat/images/quickstart-app-avatar.png
   3. En Descripción, ingresa Responds to real human conversation.
   4. En Funcionalidad, selecciona Recibir mensajes 1:1. Únete a espacios y conversaciones grupales.
   5. En Configuración de conexión, selecciona Dialogflow.
   6. En Configuración de Dialogflow, selecciona Dialogflow CX.
   7. En Agent or Environment resource name, pega el agente de Dialogflow CX. del nombre que copiaste al final de Crea un agente de Dialogflow CX.
   8. Haz que esta app de Chat esté disponible para personas y grupos específicos en tu dominio e ingresa tu dirección de correo electrónico.
   9. En Registros, selecciona Registrar errores en Logging.

3. Haz clic en Guardar.

La app de Chat está lista para recibir y responder mensajes en Chat.

Prueba la app de Chat

Envía un mensaje a la app de chat de Dialogflow CX para probar Google Chat.

1. Abre Google Chat con la cuenta de Google Workspace que que se proporcionan cuando te agregaste como verificador de confianza.

   Ir a Google Chat

2. Haz clic en Nuevo chat.
3. En el campo Add 1 or more people, escribe el nombre de tu App de Chat

4. Selecciona tu app de Chat en los resultados. Un se abrirá un mensaje.

   Nota: Si tu app de Chat no aparece en la lista de asegúrate de haber incluido tu cuenta de Google Workspace en la La configuración de Visibilidad de la Configuración de la API de Chat en la consola de Google Cloud.

5. En el nuevo mensaje directo con la app, escribe Hello. presiona enter.

   La app de Chat de Dialogflow responde con la presentación a sí mismo.

6. Completa la prueba con los muestra de conversación de prueba.

Conversación de prueba de muestra

Para probar la app de chat de Dialogflow CX en el En la consola de Dialogflow CX o en Google Chat, tienes la siguiente conversación. La explicación te ayuda a comprender cómo el agente de Dialogflow CX interpreta las lenguaje natural del usuario y produce su propia respuesta de lenguaje natural en en cada paso de la conversación. Este ejemplo de conversación se basa en agente compilado previamente llamada Viajes: alquiler de automóviles.

Diálogo	Explicación
Usuario final: Hola Agente: ¡Hola! Soy el agente virtual de alquiler de autos. Puedo ayudarte a iniciar una nueva reserva de alquiler de un automóvil. ¿Cómo puedo ayudar? hoy?	Se llama a la ruta del intent de bienvenida predeterminado en el flujo de inicio predeterminado. La entrega para este controlador de estado ("Hi! No...) se agrega a la cola de respuestas. El agente envía la cola de respuestas al usuario final.
Usuario final: Me gustaría alquilar un auto. Agente: ¿Dónde quieres retirar el vehículo?	La ruta del intent car_rental.reservation_create de la Página de inicio coincide. La sesión pasa a la página Ubicación de retiro. El formulario de la página Ubicación de retiro no está completo, por lo que el agente usa el parámetro pickup_location para solicitar al usuario ("¿Dónde quieres retirar..."), que se agrega a la cola de respuestas. El agente envía la cola de respuestas al usuario final.
Usuario final: Las Vegas Agente: De acuerdo, tu partida será en Las Vegas. Agente: ¿La ubicación de destino es diferente de la lugar de recogida?	La entrada del usuario final completa el campo pickup_location. parámetro solicitado por el agente en el período anterior turno de la conversación. El intent car_rental.return_different_location ruta en el Flujo de inicio predeterminado coincida. La ruta para completar formularios en la página Ubicación de retiro se evalúa y se llama. Tiene una entrega ("Ok, your pickup...") que se agregó. a la cola de respuestas con sus referencias de parámetros resueltas como los valores reales proporcionados por el usuario final. La sesión pasa a la página Confirmar ubicación. La página Confirmar ubicación tiene una entrega de entrada. ("¿La ubicación de destino es diferente...") que se agrega a la cola de respuestas. El agente envía la cola de respuestas al usuario final.
Usuario final: Sí. Dejaré el auto en Los Ángeles. Agente: De acuerdo, tu llegada será en Los Ángeles. Agente: ¿En qué fecha y hora quieres retirar el vehículo?	El intent car_rental.return_different_location ruta en el Flujo de inicio predeterminado coincida. La sesión pasa a la página Ubicación de entrega. La entrada del usuario final completa drop_off_location. parámetro solicitado por el agente en el período anterior turno de la conversación. La ruta para completar formularios en la página Ubicación de entrega se evalúa y se llama. Tiene una entrega ("Ok, your drop off..."), que se agregó. a la cola de respuestas. La sesión pasa a la página Rental Duration. La página Rental Duration tiene valores de formulario incompletos, por lo que Solicita al usuario el parámetro pickup_date_time. ("¿En qué fecha y hora quieres retirar el pedido..."), que se agrega a la cola de respuestas. El agente envía la cola de respuestas al usuario final.
Usuario final: Me gustaría retirar el auto el 5 de marzo al mediodía. Agente: ¿En qué fecha y hora quieres dejar el vehículo?	La entrada del usuario final completa el campo pickup_date_time. parámetro solicitado por el agente en el período anterior turno de la conversación. Falta otro valor de formulario en la página Rental Duration. por lo que le solicita al usuario el parámetro drop_off_date_time. ("¿En qué fecha y hora quieres bajar..."), que se agrega a la cola de respuestas. El agente envía la cola de respuestas al usuario final.
Usuario final: El 15 de marzo al mediodía. Agente: Entonces, para confirmar, Recogerás el vehículo en Las Vegas 2024-03-05 12:00:00 y lo dejo en Los Ángeles 15-03-2024 12:00:00 p.m. ¿Te parece bien?	La entrada del usuario final completa el campo drop_off_date_time. parámetro solicitado por el agente en el período anterior turno de la conversación. La sesión pasa a la página Confirmar la duración del alquiler. La página Confirmar duración de alquiler tiene una entrega de entrada. ("Por lo tanto, para confirmar..."), que se agrega a la cola de respuestas. El agente envía la cola de respuestas al usuario final.
Usuario final: Sí, gracias. Agente: Excelente. Ahora elijamos un vehículo. Agente: ¿Te gustaría tener una economía o un lujo? vehículo?	El intent small_talk.confirmation.yes ruta correspondiente de la página Confirmar duración del alquiler. El agente confirma la elección del usuario con un mensaje. ("¡Genial! Ahora elijamos..."), que se agrega a la cola de respuestas. La sesión pasa a la página Desambiguación del vehículo. El formulario de la página Desambiguación del vehículo no está completo, por lo que el agente usa el parámetro vehicle_type para solicitarle al usuario ("¿Te gustaría tener una economía o un lujo..."), que se agrega a la cola de respuestas. El agente envía la cola de respuestas al usuario final.
Usuario final: Economía. Agente: ¿Te gustaría el auto o el camión de Cymbal?	El intent $session.params.vehicle_type="economy_vehicle" que coincida la ruta. La sesión pasa a la página Opciones de economía. La página Opciones económicas tiene una entrega de entrada. ("¿Te gustaría..."), que se agrega a la cola de respuestas. El agente envía la cola de respuestas al usuario final.
Usuario final: Cymbal Truck Agente: El camión de Cymbal cuesta USD 50.33 al día. Para 4 personas, incluye una radio AM/FM. ¿Quieres continuar con el pago? Usuario final: Sí.	El intent $session.params.vehicle_type="Cymbal Truck" La ruta coincide y se completa el parámetro vehicle_model. La sesión pasa a la página Confirmar la camioneta de Cymbal. La página Confirmar camión de Cymbal tiene una entrega de entrada. ("El camión de Cymbal cuesta $50.33 por día..."), que se agrega a la cola de respuestas. El agente envía la cola de respuestas al usuario final. La respuesta del usuario coincide con small_talk.confirmation.yes. ruta.
Agente: ¿Qué tipo de tarjeta usarás? Usuario final: Altostrat Agente: Ingresa el número de tarjeta. Usuario final: 1234 1234 1234 1234 Agente: ¿Cuál es el nombre que aparece en la tarjeta? Usuario final: Carlos Agente: ¿Cuál es la dirección de facturación? Usuario final: 1800 Amphibious Blvd. Mountain View, CA Agente: ¿Cuál es el código postal de facturación? Usuario final: 94045 Agente: Elegirás el auto de Cymbal. en Las Vegas, 2024-03-05 12:00:00, y lo dejé 2024-03-15 12:00:00. El total para este viaje será de USD 175.38. Agente: Gracias por alquilar con nosotros. Que tengas un buen día.	La sesión pasa a la página Pagos. El formulario de pago no está completo, por lo que el agente lo solicita. al usuario para los campos card_type, card_number, billing_name, billing_street_address, y billing_zip_code. ("What card type will..."), que se agregan de forma secuencial a la cola de respuestas y se envían como el usuario. Las respuestas del usuario establecen el valor de cada parámetro. La sesión pasa a la página de Confirmación del alquiler. La página Confirmación de alquiler tiene una entrega de entradas. ("Ok, tu partida será..."), que se agrega a la cola de respuestas. El agente envía la cola de respuestas al usuario final. La sesión pasa a la página Finalizar sesión.

Envía mensajes de tarjetas desde Dialogflow

Codelab: Para un ejemplo aplicado del envío de mensajes de tarjetas. desde Dialogflow, consulta Muestra fuentes en las respuestas de la app de conocimiento de Chat en el codelab Compila apps para Google Chat con Gemini.

Dialogflow puede responder con texto o tarjetas. Para responder con una tarjeta mensaje, especifícalo como carga útil personalizada en entregas.

El siguiente JSON muestra cómo enviar un mensaje de tarjeta como una carga útil personalizada en entrega:

json

{
  'cardsV2': [{
    'cardId': 'createCardMessage',
    'card': {
      'header': {
        'title': 'A card message!',
        'subtitle': 'Sent from Dialogflow',
        'imageUrl': 'https://developers.google.com/chat/images/chat-product-icon.png',
        'imageType': 'CIRCLE'
      },
      'sections': [
        {
          'widgets': [
            {
              'buttonList': {
                'buttons': [
                  {
                    'text': 'Read the docs!',
                    'onClick': {
                      'openLink': {
                        'url': 'https://developers.google.com/workspace/chat'
                      }
                    }
                  }
                ]
              }
            }
          ]
        }
      ]
    }
  }]
}

Límites y consideraciones

• Eventos de interacción de chat tienen asistencia limitada y algunas consideraciones:
  • Lo siguiente tipos de eventos de interacción compatibles:
    • MESSAGE
    • ADDED_TO_SPACE
    • CARD_CLICKED
  • En el caso de los eventos MESSAGE o ADDED_TO_SPACE, la entrada de la consulta enviada al El agente de Dialogflow corresponde al valor del campo argumentText en el mensaje de Chat. Si el mensaje incluye un Comando de barra, el valor de se usa el campo text en su lugar.
  • Para los eventos CARD_CLICKED, la entrada de la consulta que se envía al agente de Dialogflow tiene el formato CARD_CLICKED.functionName, en el que functionName corresponde al valor del campo function de la Objeto Action adjunta al elemento de tarjeta interactiva (como un botón).
  • La carga útil completa de JSON de cada evento de interacción de Chat se envía a Dialogflow como una carga útil personalizada en el parámetro de consulta. se puede acceder con una Webhook de Dialogflow consultando el valor del campo WebhookRequest.payload.
• Consideraciones para responder a comandos de barra y recepción de datos de tarjetas o diálogos:
  .
  • Cuando las apps de Chat de Dialogflow reciben un mensaje con una barra. , la entrada de la consulta contiene solo el valor del campo text. El campo text comienza con el nombre del comando de barra (por ejemplo, /command), que puedes usar para configurar el intent de un agente de Dialogflow para detectar un comando de barra.
  • Si el agente de Dialogflow debe procesar los Carga útil de JSON del evento de interacción de chat, puedes hacerlo con un Webhook de Dialogflow para inspeccionar la carga útil personalizada en el parámetro de consulta.
  • Para mostrar un diálogo de Agente de Dialogflow, responde con una única carga útil de JSON personalizada que incluye un mensaje que contiene un DIALOG acción de respuesta.
  • Para procesar los datos ingresados desde las tarjetas, el agente de Dialogflow puede detectar intents que comienzan con el texto CARD_CLICKED y responden con un carga útil única de JSON personalizada que contiene los datos action.
• No se admiten las vistas previas de vínculos.
• Si el agente de Dialogflow responde con un solo mensaje, este se envía a Google Chat de forma síncrona. Si el agente de Dialogflow responde con varios mensajes, todos los mensajes se envían a Chat de forma asíncrona llamando al create en el recurso spaces.messages de la API de Chat una vez por cada mensaje.
• Cuando uses la integración de Dialogflow CX en Chat, se deben configurar el agente de Dialogflow y la app de Chat en el mismo proyecto de Google Cloud. Si necesitas configurar Dialogflow y Chat en diferentes proyectos de Cloud, puedes un servidor intermedio para facilitar la conexión. Para aprender a hacerlo, consulta esto Ejemplo de integración de chat para Dialogflow CX en GitHub.

Solucionar problemas

Cuando una app de Google Chat o card muestra un error, el En la interfaz de Chat, aparece un mensaje que dice “Se produjo un error”. o "No se pudo procesar la solicitud". A veces, la IU de Chat no muestra ningún mensaje de error, pero la app de Chat la tarjeta produce un resultado inesperado; Por ejemplo, es posible que un mensaje de tarjeta no para que aparezca la opción.

Aunque es posible que no aparezca un mensaje de error en la IU de Chat, Hay mensajes de error descriptivos y datos de registro disponibles para ayudarte a corregir errores. Cuando se activa el registro de errores de las apps de Chat. Para obtener ayuda sobre la visualización, la depuración y la corrección de errores, consulta Soluciona problemas y corrige errores de Google Chat.

Limpia

Para evitar que se apliquen cargos a tu cuenta de Google Cloud por el recursos usados en este instructivo, te recomendamos que borres el Cloud.

Precaución: Borrar un proyecto tiene las siguientes consecuencias:

• Se borra todo en el proyecto. Si utilizaste un proyecto existente para este instructivo, cuando lo borres, también borrarás cualquier otro trabajo que hayas realizado en el proyecto.
• Se pierden los ID personalizados de proyectos. Cuando creaste este proyecto, es posible que hayas creado un ID del proyecto personalizado que desees utilizar en el futuro. Para conservar las URLs que usan el ID del proyecto, como una URL en appspot.com, borra los recursos seleccionados dentro del proyecto en lugar de borrar todo el proyecto.

Si planeas explorar varios instructivos y guías de inicio rápido, la reutilización de proyectos puede ayudarte a evitar exceder los límites de las cuotas del proyecto.

1. En la consola de Google Cloud, ve a la página Administrar recursos. Haz clic en Menú > IAM y Administrador > Administrar recursos.

   Ir a Resource Manager

2. En la lista de proyectos, elige el proyecto que quieres borrar y haz clic en Borra .
3. En el diálogo, escribe el ID del proyecto y, luego, haz clic en Cerrar para borrarlo. el proyecto.

Temas relacionados

• Dialogflow CX toma un máquina de estados para el diseño de agentes de Dialogflow, que ofrece un enfoque claro el control de una conversación, una mejor experiencia del usuario final y una mejor en el flujo de trabajo de desarrollo de software. Cuando compilas una instancia de Dialogflow app de Chat, recomendamos usar Dialogflow CX.
  • Para obtener más información sobre la compilación y configuración de agentes, consulta Agentes de Dialogflow CX.
  • Para obtener una explicación detallada con instrucciones para compilar y configurar agentes, consulta Crea un agente de Dialogflow CX.
  • Codelab: Consulta un ejemplo de cómo compilar datos de Dialogflow CX. agente de la tienda, consulta la app de Chat de conocimiento el codelab Compila apps para Google Chat con Gemini.
  • Codelab: Consulta un ejemplo de cómo compilar un Dialogflow CX. agente de conversación, ver la app de Chat de comentarios del codelab Compila apps para Google Chat con Gemini.
• Dialogflow ES es otra forma de usar Dialogflow con una app de Chat.