Créer une application Google Chat Dialogflow CX qui comprend le langage naturel et y répond

Cette page explique comment créer une application Google Chat capable de comprendre le langage naturel et d'y répondre à l'aide de Dialogflow. Ce guide utilise Dialogflow CX, qui s'intègre directement à Google Chat, disponible dans la version Preview développeur. Vous pouvez également utiliser Dialogflow ES pour créer une application Google Chat Dialogflow ES en suivant le guide Google Chat Dialogflow ES.

Prenons l'exemple d'une application Chat qui aide les utilisateurs à louer une voiture. Un utilisateur peut écrire : "Je souhaite louer une voiture". L'application Chat peut répondre par une question du type "Où souhaitez-vous récupérer le véhicule ?", ce qui lance une conversation humaine avec l'utilisateur. L'application Chat comprend la voix humaine et y répond lors de la réservation de la voiture.

Ce n'est qu'un exemple. Les applications de chat Dialogflow sont utiles dans tous les types d'interactions. Si elle nécessite une voix humaine naturelle, elle fait appel à une application de chat Dialogflow. Les agents prédéfinis vous aident à démarrer rapidement et vous montrent ce que Dialogflow peut faire, par exemple:

  • Réserver des vols
  • Prendre rendez-vous chez le médecin
  • Commander un repas à domicile
  • Répondre à des questions sur un catalogue de produits Retail (par exemple, savoir si des articles sont disponibles dans d'autres coloris)
  • Page de sélection de l'agent Dialogflow prédéfini
    Figure 1. Sélection d'un agent prédéfini pour une application Chat Dialogflow
  • Tester l'agent dans Dialogflow CX
    Figure 2 : Tester l'agent dans Dialogflow CX pour vérifier que sa logique et sa configuration fonctionnent comme prévu Le diagramme montre un ensemble séquentiel de pages thématiques qui concernent des étapes spécifiques de la conversation, comme la définition d’un lieu de prise en charge et de retour pour une voiture de location, et configure la logique qui les relie. La conversation est testée dans un simulateur.
  • Configurer une application de chat Dialogflow
    Figure 3 : configurer une application Chat pour traiter les réponses à l'aide de l'agent Dialogflow CX sur la page de configuration de l'API Chat dans la console Google Cloud ;
  • Tester l'application Chat Dialogflow CX
    Figure 4 : Je discute avec Google de la réservation d'une voiture de location avec l'application Dialogflow Chat.

Objectifs

  • configurer votre environnement ;
  • Créer et déployer un agent Dialogflow CX
  • Créez et déployez une application Chat fournie par l'agent Dialogflow CX.
  • Testez l'application Chat.

Prérequis

Architecture

Le schéma suivant illustre l'architecture d'une application Chat créée avec Dialogflow:

Architecture d'une application Chat mise en œuvre avec Dialogflow.

Dans le schéma précédent, un utilisateur qui interagit avec une application Chat Dialogflow présente le flux d'informations suivant:

  1. Un utilisateur envoie un message dans Chat à une application Chat, dans un message privé ou dans un espace Chat.
  2. Un agent virtuel Dialogflow, qui réside dans Google Cloud, reçoit et traite le message pour produire une réponse.
  3. À l'aide d'un webhook Dialogflow, l'agent Dialogflow peut éventuellement interagir avec des services tiers externes, tels qu'un système de gestion de projet ou un outil de billetterie.
  4. L'agent Dialogflow renvoie une réponse au service de l'application Chat dans Chat.
  5. La réponse est envoyée à l'espace Chat.

Configurer l'environnement

Avant d'utiliser les API Google, vous devez les activer dans un projet Google Cloud. Vous pouvez activer une ou plusieurs API dans un même projet Google Cloud.
  1. Dans la console Google Cloud, activez les API Google Chat et Dialogflow.

    Activer les API

  2. Vérifiez que vous activez les API dans le bon projet Cloud, puis cliquez sur Suivant.

  3. Vérifiez que vous activez les bonnes API, puis cliquez sur Activer.

Créer un agent Dialogflow CX

Un agent Dialogflow CX est un agent virtuel qui gère les conversations simultanées avec vos utilisateurs finaux. Il s'agit d'un module de compréhension du langage naturel qui comprend les nuances du langage humain. Dialogflow traduit le texte de l'utilisateur final au cours d'une conversation en données structurées compréhensibles par vos applications et services. Vous concevez et créez un agent Dialogflow capable de gérer les types de conversations requis pour votre système.

Un agent Dialogflow s'apparente à un agent de centre d'appels humain. Vous les entraînez tous les deux à gérer les scénarios de conversation attendus. Votre entraînement n'a pas besoin d'être trop explicite.

Pour créer l'agent Dialogflow CX, procédez comme suit:

  1. Dans la console Dialogflow CX, ouvrez la console Dialogflow CX. Cliquez sur Menu > Dialogflow CX.

    Accéder à la console Dialogflow CX

  2. Choisissez un projet Google Cloud. Pour trouver votre projet, vous devrez peut-être cliquer sur Tout, puis le rechercher.

  3. Vous pouvez désormais choisir un agent prédéfini ou créer le vôtre. Si vous préférez explorer la personnalisation des agents plus en détail ultérieurement, choisissez l'un des agents prédéfinis, qui sont également utiles pour en savoir plus sur ce qu'ils peuvent faire.

    Pour choisir un agent prédéfini, procédez comme suit:

    1. Cliquez sur Utiliser des agents prédéfinis.
    2. Sélectionnez un agent prédéfini. Pour ce guide, sélectionnez Voyage: location de voitures.

      Les agents sont notés "Débutant", "Intermédiaire" ou "Avancé" en fonction du nombre de fonctionnalités qu'ils utilisent et de la sophistication de leur logique de conversation. Le choix d'un agent intermédiaire ou avancé peut nécessiter des personnalisations et des paramètres spécifiques, y compris l'activation de fonctionnalités et d'API dans la console Google Cloud.

    3. Cliquez sur Import as agent (Importer en tant qu'agent).

    Pour créer votre propre agent, procédez comme suit:

    1. Cliquez sur Create Agent (Créer un agent).
    2. Sélectionnez Générer automatiquement pour créer un agent de data store, ou Créez le vôtre pour créer d'autres types d'agents.

    Pour une présentation détaillée du processus de création d'agent, consultez la page Créer un agent Dialogflow CX.

  4. Configurez les paramètres de base de l'agent:

    1. Dans Nom à afficher, saisissez un nom à afficher.
    2. Sélectionnez votre lieu préféré. Si vous souhaitez modifier les paramètres de localisation avancés, cliquez sur Modifier.
    3. Sélectionnez le fuseau horaire de votre choix.
    4. Sélectionnez la langue par défaut de votre agent. Vous ne pouvez pas modifier la langue par défaut d'un agent après sa création.
  5. Cliquez sur Créer. Dialogflow CX commence à créer l'agent, puis affiche son flux de démarrage par défaut.

  6. Vous pouvez éventuellement personnaliser l'agent. Pour découvrir en détail le processus de personnalisation de l'agent, consultez la page Créer un agent Dialogflow CX.

  7. Nous vous recommandons de tester l'agent:

    1. Cliquez sur Tester l'agent.
    2. Sélectionnez Tester l'agent dans l'environnement.
    3. Dans "Environnement", sélectionnez Brouillon.
    4. Dans "Flow" (Flux), sélectionnez Default Start Flow (Flux de démarrage par défaut).
    5. Dans "Page", sélectionnez Page d'accueil.
    6. Dans la barre de rédaction Talk to agent (Parler à l'agent), saisissez Hello, puis appuyez sur Entrée. L'agent répond en se présentant.
    7. Effectuez le test à l'aide de l'exemple de conversation test.
  8. L'agent Dialogflow CX est créé. Revenez à la console Dialogflow CX. Cliquez sur Menu > Dialogflow CX.

    Accéder à la console Dialogflow CX

  9. Sous Agents, cliquez sur > Copier le nom. Enregistrez ce nom, car vous l'utiliserez lors de la configuration de l'application Chat.

Créer une application Chat et l'associer à l'agent Dialogflow

Après avoir créé un agent Dialogflow CX, procédez comme suit pour le transformer en application Chat:

  1. Dans la console Google Cloud, accédez à l'API Google Chat. Recherchez "API Google Chat" et cliquez sur API Google Chat, puis sur Gérer.

    Accéder à l'API Chat

  2. Cliquez sur Configuration et configurez l'application Chat:

    1. Dans le champ Nom de l'application, saisissez Dialogflow App.
    2. Dans URL de l'avatar, saisissez https://developers.google.com/workspace/chat/images/quickstart-app-avatar.png.
    3. Dans Description, saisissez Responds to real human conversation.
    4. Sous Fonctionnalité, sélectionnez Recevoir des messages privés et Rejoindre des espaces et des conversations de groupe.
    5. Sous Paramètres de connexion, sélectionnez Dialogflow.
    6. Dans Dialogflow settings (Paramètres Dialogflow), sélectionnez Dialogflow CX.
    7. Dans Nom de la ressource de l'agent ou de l'environnement, collez le nom de l'agent Dialogflow CX que vous avez copié à la fin de la section Créer un agent Dialogflow CX.
    8. Rendez cette application Chat accessible à des personnes et des groupes spécifiques de votre domaine, puis saisissez votre adresse e-mail.
    9. Sous Journaux, sélectionnez Consigner les erreurs dans Logging.
  3. Cliquez sur Enregistrer.

L'application Chat est prête à recevoir des messages et à y répondre dans Chat.

Tester l'application Chat

Testez l'application Chat Dialogflow CX en lui envoyant un message dans Google Chat.

  1. Ouvrez Google Chat avec le compte Google Workspace que vous avez indiqué lorsque vous vous avez ajouté en tant que testeur de confiance.

    Accéder à Google Chat

  2. Cliquez sur Nouveau chat.
  3. Dans le champ Ajouter une ou plusieurs personnes, saisissez le nom de votre application Chat.
  4. Sélectionnez votre application Chat dans les résultats. Un message privé s'affiche.

  5. Dans le nouveau message privé contenant l'application, saisissez Hello, puis appuyez sur enter.

    L'application Chat de Dialogflow répond en se présentant.

  6. Effectuez le test en utilisant l'exemple de conversation de test.

Exemple de conversation test

Pour tester l'application Chat Dialogflow CX dans la console Dialogflow CX ou dans Google Chat, engagez la conversation suivante. L'explication vous aide à comprendre comment l'agent Dialogflow CX interprète le langage naturel de l'utilisateur et produit sa propre réponse en langage naturel à chaque étape de la conversation. Cet exemple de conversation est basé sur l'agent prédéfini appelé Voyage: location de voitures.

Destination de boîte de dialogue Explication
Utilisateur final:Bonjour
Agent:Bonjour ! Je suis l'agent virtuel de location de voitures. Je peux vous aider à réserver une location de voiture. Que puis-je faire pour vous aujourd'hui ?
  1. La route Default Welcome Intent (Intent de bienvenue par défaut) du flux de démarrage par défaut est appelée.
  2. Le fulfillment pour ce gestionnaire d'état ("Hi! Je suis...") est ajouté à la file d'attente de réponses.
  3. L'agent envoie la file d'attente de réponses à l'utilisateur final.
Utilisateur final:Je souhaite louer une voiture.
Agent: Où souhaitez-vous récupérer le véhicule ?
  1. La route d'intent car_rental.reservation_create sur la page d'accueil est mise en correspondance.
  2. La session effectue une transition vers la page Lieu de retrait.
  3. Le formulaire de la page pickup_location n'est pas rempli. L'agent utilise donc le paramètre pickup_location pour demander à l'utilisateur "Où souhaitez-vous récupérer vos articles ?", qui est ajoutée à la file d'attente de réponses.
  4. L'agent envoie la file d'attente de réponses à l'utilisateur final.
Utilisateur final:Las Vegas
Agent:D'accord, votre retrait aura lieu à Las Vegas.
Agent: Votre lieu de dépose est-il différent de votre lieu de prise en charge ?
  1. L'entrée de l'utilisateur final remplit le paramètre pickup_location demandé par l'agent lors du tour de conversation précédent.
  2. La route de l'intent car_rental.return_different_location dans le car_rental.return_different_location est mise en correspondance.
  3. Le parcours de remplissage du formulaire sur la page Pickup Location (Lieu de retrait) est évalué et appelé. Il dispose d'un traitement ("OK, votre retrait...") qui est ajouté à la file d'attente de réponses avec ses références de paramètres résolues avec les valeurs réelles fournies par l'utilisateur final.
  4. La session effectue une transition vers la page Confirm Location (Confirmer l'emplacement).
  5. La page Confirmer l'emplacement propose un traitement d'entrée ("Est-ce que votre lieu de dépôt est différent..."), qui est ajoutée à la file d'attente de réponses.
  6. L'agent envoie la file d'attente de réponses à l'utilisateur final.
Utilisateur final:oui. Je déposerai la voiture à Los Angeles.
Agent:D'accord, votre dépose aura lieu à Los Angeles.
Agent: À quelle date et à quelle heure souhaitez-vous récupérer le véhicule ?
  1. La route de l'intent car_rental.return_different_location dans le car_rental.return_different_location est mise en correspondance.
  2. La session effectue une transition vers la page Drop Off Location (Lieu de dépôt).
  3. L'entrée de l'utilisateur final remplit le paramètre drop_off_location demandé par l'agent lors du tour de conversation précédent.
  4. La route permettant de remplir le formulaire sur la page Drop Off Location (Lieu de dépôt) est évaluée et appelée. Il comporte un traitement ("OK, votre dépôt..."), qui est ajouté à la file d'attente de réponses.
  5. La session effectue une transition vers la page Durée de location.
  6. La page Durée de location contient des valeurs de formulaire incomplètes. Elle invite donc l'utilisateur à saisir le paramètre pickup_date_time ("À quelle date et à quelle heure souhaitez-vous récupérer..."), qui est ajoutée à la file d'attente de réponses.
  7. L'agent envoie la file d'attente de réponses à l'utilisateur final.
Utilisateur final:Je souhaite récupérer la voiture le 5 mars à midi.
Agent:À quelle date et à quelle heure souhaitez-vous déposer le véhicule ?
  1. L'entrée de l'utilisateur final remplit le paramètre pickup_date_time demandé par l'agent lors du tour de conversation précédent.
  2. Il manque une autre valeur dans le formulaire de la page Durée de location. Elle invite donc l'utilisateur à indiquer le paramètre drop_off_date_time ("À quelle date et à quelle heure souhaitez-vous déposer..."). qui est ajoutée à la file d'attente de réponses.
  3. L'agent envoie la file d'attente de réponses à l'utilisateur final.
Utilisateur final:15 mars à midi.
Agent: Donc, pour confirmation :

Vous allez récupérer le véhicule à Las Vegas le 05/03/2024 12:00:00 et le déposer à Los Angeles le 15/03/2024 12:00:00

C'est bien ça ?
  1. L'entrée de l'utilisateur final remplit le paramètre drop_off_date_time demandé par l'agent lors du tour de conversation précédent.
  2. La session effectue une transition vers la page Confirmer la durée de location.
  3. La page Confirmer la durée de la location comporte une entrée ("Donc pour confirmer..."). qui est ajoutée à la file d'attente de réponses.
  4. L'agent envoie la file d'attente de réponses à l'utilisateur final.
Utilisateur final:Oui, merci.
Agent:Parfait ! Choisissons maintenant un véhicule.
Agent: Préférez-vous un véhicule économique ou de luxe ?
  1. Le parcours d'intent small_talk.confirmation.yes sur la page Confirmer la durée de la location est mis en correspondance.
  2. L'agent confirme le choix de l'utilisateur en affichant un message ("Excellent ! Choisissons maintenant..."), qui est ajoutée à la file d'attente de réponses.
  3. La session affiche la page Désambiguïté du véhicule.
  4. Le formulaire de clarification du véhicule n'est pas rempli. L'agent utilise donc le paramètre vehicle_type pour demander à l'utilisateur ("Voulez-vous une classe économique ou de luxe..."), qui est ajoutée à la file d'attente de réponses.
  5. L'agent envoie la file d'attente de réponses à l'utilisateur final.
Utilisateur final:Économie, s'il vous plaît.
Agent: Préférez-vous la voiture Cymbal ou le camion Cymbal ?
  1. La route d'intent $session.params.vehicle_type="economy_vehicle" est mise en correspondance.
  2. La session effectue une transition vers la page Options économiques.
  3. La page Economy Options (Options économiques) contient un traitement d'entrée ("Est-ce que vous préférez..."), qui est ajoutée à la file d'attente de réponses.
  4. L'agent envoie la file d'attente de réponses à l'utilisateur final.
Utilisateur final:Cymbal Truck.
Agent:Le camion Cymbal coûte 50,33 $par jour. Elle peut accueillir quatre personnes et est équipée d'une radio AM/FM. Souhaitez-vous procéder au paiement ?
Utilisateur final:Oui, s'il vous plaît.
  1. La route d'intent $session.params.vehicle_type="Cymbal Truck" est mise en correspondance et le paramètre vehicle_model est renseigné.
  2. La session effectue une transition vers la page Confirmer Cymbal Truck.
  3. La page Confirm Cymbal Truck (Confirmer le camion Cymbal) comporte un traitement d'entrée ("Le camion Cymbal est à 50,33 $par jour..."). qui est ajoutée à la file d'attente de réponses.
  4. L'agent envoie la file d'attente de réponses à l'utilisateur final.
  5. La réponse de l'utilisateur correspond à la route small_talk.confirmation.yes.
Agent:Quel type de carte allez-vous utiliser ?
Utilisateur final:Altostrat
Agent:Veuillez saisir le numéro de la carte.
Utilisateur final:1234 1234 1234 1234
Agent:Quel est le nom indiqué sur la carte ?
Utilisateur final:Charlie
Agent:Quelle est l'adresse postale de facturation ?
Utilisateur final:1800 Amphibious Blvd. Mountain View, CA
Agent:Quel est le code postal de la facturation ?
Utilisateur final:94045
Agent:Vous allez récupérer la voiture Cymbal à Las Vegas le 05/03/2024 12:00:00 et la rendre le 15/03/2024 12:00:00. Le total de ce trajet sera de 175,38 $.
Agent: Merci d'avoir loué notre véhicule et bonne journée.
  1. La session effectue une transition vers la page Paiement.
  2. Le formulaire de paiement n'est pas rempli. L'agent invite donc l'utilisateur à indiquer les paramètres card_type, card_number, billing_name, billing_street_address et billing_zip_code ("Quel type de carte va..."). qui sont ajoutés séquentiellement à la file d'attente de réponses et envoyés lorsque l'utilisateur répond. Les réponses de l'utilisateur définissent chaque valeur de paramètre.
  3. La session effectue une transition vers la page Confirmation de location.
  4. La page Confirmation de location comporte une entrée ("OK, votre retrait sera..."), qui est ajoutée à la file d'attente de réponses.
  5. L'agent envoie la file d'attente de réponses à l'utilisateur final.
  6. La session passe à la page End Session (Terminer la session).

Envoyer des messages de carte à partir de Dialogflow

Dialogflow peut répondre à l'aide de messages texte ou sous forme de fiches. Pour répondre avec un message de carte, spécifiez-le en tant que charge utile personnalisée dans le fulfillment.

Le code JSON suivant montre comment envoyer un message de carte en tant que charge utile personnalisée dans le traitement:

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'
                      }
                    }
                  }
                ]
              }
            }
          ]
        }
      ]
    }
  }]
}

Limites et considérations

  • La prise en charge des événements d'interaction de chat est limitée et certains points sont à prendre en compte :
    • Les types d'événements d'interaction suivants sont acceptés :
      • MESSAGE
      • ADDED_TO_SPACE
    • L'entrée de requête envoyée à l'agent Dialogflow correspond à la valeur du champ argumentText dans le message Chat. Si le message inclut une commande à barre oblique, la valeur du champ text est utilisée à la place.
    • La charge utile JSON complète de chaque événement d'interaction Chat est envoyée à Dialogflow en tant que charge utile personnalisée dans le paramètre de requête. Elle est accessible via un webhook Dialogflow en interrogeant la valeur du champ WebhookRequest.payload.
  • La compatibilité des commandes à barre oblique est limitée :
    • Les commandes à barre oblique qui ouvrent des boîtes de dialogue ne sont pas compatibles avec les applications Chat de Dialogflow.
    • Lorsque les applications de chat Dialogflow reçoivent un message contenant une commande à barre oblique, la requête ne contient que la valeur du champ text. Le champ text commence par le nom de la commande à barre oblique (par exemple, /command), que vous pouvez utiliser pour configurer l'intent d'un agent Dialogflow afin de détecter une commande à barre oblique.
    • Si l'agent Dialogflow doit traiter la charge utile JSON de l'événement d'interaction Chat de la commande à barre oblique, il peut le faire en utilisant un webhook Dialogflow pour inspecter la charge utile personnalisée dans le paramètre de requête.
  • Les aperçus de liens ne sont pas acceptés.
  • Si l'agent Dialogflow répond avec un seul message, celui-ci est envoyé à Google Chat de manière synchrone. Si l'agent Dialogflow répond avec plusieurs messages, tous les messages sont envoyés à Chat de manière asynchrone en appelant la méthode create sur la ressource spaces.messages de l'API Chat une fois pour chaque message.

Dépannage

Lorsqu'une application ou une fiche Google Chat renvoie une erreur, l'interface Chat affiche un message indiquant "Un problème est survenu" ou "Impossible de traiter votre demande". Il peut arriver que l'interface Chat n'affiche aucun message d'erreur, mais que l'application ou la fiche Chat génère un résultat inattendu. Par exemple, il est possible qu'un message de fiche ne s'affiche pas.

Bien qu'aucun message d'erreur ne s'affiche dans l'interface Chat, des messages d'erreur descriptifs et des données de journal sont disponibles pour vous aider à corriger les erreurs lorsque la journalisation des erreurs est activée pour les applications Chat. Si vous avez besoin d'aide pour afficher, déboguer et corriger les erreurs, consultez Résoudre les erreurs Google Chat.

Effectuer un nettoyage

Pour éviter que les ressources utilisées dans ce tutoriel soient facturées sur votre compte Google Cloud, nous vous recommandons de supprimer le projet Cloud.

  1. Dans la console Google Cloud, accédez à la page Gérer les ressources. Cliquez sur Menu > IAM et administration > Gérer les ressources.

    Accéder à Resource Manager

  2. Dans la liste des projets, sélectionnez le projet que vous souhaitez supprimer, puis cliquez sur Supprimer .
  3. Dans la boîte de dialogue, saisissez l'ID du projet, puis cliquez sur Arrêter pour supprimer le projet.
  • Dialogflow CX adopte une approche de type machine à états pour concevoir l'agent Dialogflow, ce qui vous offre un contrôle clair et explicite sur une conversation, une meilleure expérience utilisateur et un meilleur workflow de développement. Lorsque vous créez une application Chat Dialogflow, nous vous recommandons d'utiliser Dialogflow CX.
    • Pour en savoir plus sur la création et la configuration d'agents, consultez la page Agents Dialogflow CX.
    • Pour obtenir des instructions détaillées sur la création et la configuration des agents, consultez la page Créer un agent Dialogflow CX.
  • Dialogflow ES est une autre façon d'utiliser Dialogflow avec une application Chat.