Créez un chatbot d'envoi d'e-mails avec Google Dialogflow
Les chatbots sont de plus en plus populaires sur les sites internet des entreprises, notamment pour le service client. Apprenez à créer votre propre assistant IA.
Les chatbots deviennent un outil de plus en plus vital pour les entreprises à l’ère moderne. Avec les bons outils et le savoir-faire, les entreprises créent des agents de chat capables d’avoir de véritables conversations avec les clients.
Google Dialogflow ES est l'un des outils de création de chatbot les plus puissants et gratuits du marché. Mais comment libérer tout son potentiel ?
Étape 1 : Créez votre agent Dialogflow ES
La création de votre propre agent Dialogflow ES est la première étape de ce processus. N'importe quel compte Google fonctionne et vous commencez par accéder au site Web de Google Dialogflow ES. Cliquez sur Créer un agent une fois connecté et remplissez les détails du formulaire avant de cliquer sur Créer. Vous pouvez utiliser Dialogflow pour créer un chatbot pour le divertissement, l'automatisation ou le service client. Ce projet couvre ce dernier.
Étape 2 : Ajouter des intentions de suivi Dialogflow
Le nouvel agent a uniquement une intention de bienvenue par défaut et une intention de repli par défaut. Une intention est un fragment ou une étape d’une conversation.
Vous devez ajouter deux intentions de suivi à l'intention de bienvenue par défaut existante pour commencer. Passez la souris sur l'Intention de bienvenue par défaut, cliquez sur Ajouter une intention de suivi et choisissez Oui dans le menu déroulant. Répétez le processus en sélectionnant Non dans le menu déroulant pour créer la deuxième intention de suivi.
L'intention Aucun suivi mettra fin à la conversation et dira au revoir à l'utilisateur. Ouvrez l'Aucune intention de suivi et ajoutez une série de réponses textuelles pour mettre fin à la conversation. Activez le curseur Définir cette intention comme fin de conversation.
Revenez à l'écran principal des intentions et cliquez sur Oui, intention de suivi pour l'ouvrir.
Étape 3 : Créez une liste de réponses Dialogflow riche avec JSON
Maintenant que ces intentions sont configurées, il est temps de poser une question à l'utilisateur afin qu'il puisse y accéder. Ouvrez l'Intention de bienvenue par défaut et Supprimez les réponses avec lesquelles elle a été générée. Cliquez sur Ajouter des réponses et sélectionnez Charge utile personnalisée dans le menu.
Le code JSON ci-dessous ajoute deux types différents de réponses riches : informations et jetons.
{
"richContent": [
[
{
"type": "chips",
"options": [
{
"text": "Yes"
},
{
"text": "No"
}
]
},
{
"image": {
"src": {
"rawUrl": "https://upload.wikimedia.org/wikipedia/commons/thumb/5/50/TK_email_icon.svg/1024px-TK_email_icon.svg.png"
}
},
"title": "Tell me about yourself :)",
"subtitle": "Give me some of your personal information. I'll send it to you in an email. That's the deal; absolutely no funny business. Promise! You in?",
"type": "info"
}
]
]
}Étape 4 : Collectez le nom de l'utilisateur en tant que paramètre Dialogflow
Ensuite, il est temps d'ajouter une autre intention de suivi pour collecter les données de l'utilisateur. Comme indiqué à l'étape 2, vous devriez déjà avoir une intention de suivi Oui qui demande le nom de l'utilisateur. Passez la souris sur Oui intention de suivi dans le menu principal des intentions, cliquez sur Ajouter une intention de suivi et sélectionnez Personnalisé dans la liste.
Cela créera une nouvelle intention de suivi sans aucune phrase d'entraînement. Accédez à la section Phrases de formation, tapez un nom dans la case et appuyez sur Entrée pour l'ajouter en tant que nouvelle phrase. Cela déclenchera la création d'un nouveau paramètre avec le type d'entité @sys.person. Cliquez sur l'entité @sys.person et remplacez-la par une entité @sys.given-name.
Cela stockera les entrées de l'utilisateur afin que l'agent puisse les utiliser. Accédez à la section Réponses et ajoutez une réponse contenant $given-name. Cela appelle le paramètre de nom que vous avez collecté, lui permettant d'apparaître dans le chat.
Étape 5 : Utiliser une charge utile personnalisée Dialogflow pour déclencher des intentions
En restant dans l'intention de suivi que vous venez d'ajouter, cliquez sur Ajouter des réponses et sélectionnez Charge utile personnalisée dans la liste. L'ajout du code JSON ci-dessous à cette section déclenchera une réponse riche en liste demandant à l'utilisateur de choisir une couleur.
La partie la plus importante de ce code JSON est la section événement avec chaque entrée. Lorsque vous cliquez dessus, chaque élément de la liste appelle un événement appelé COLOR avec le nom et les paramètres de couleur qui ont été collectés jusqu'à présent. Les intentions peuvent se voir attribuer des événements qui les déclencheront.
{
"richContent": [
[
{
"event": {
"languageCode": "en",
"parameters": {
"name": "$given-name",
"color": "Red"
},
"name": "COLOR"
},
"title": "Red",
"type": "list"
},
{
"type": "divider"
},
{
"event": {
"name": "COLOR",
"languageCode": "en",
"parameters": {
"name": "$given-name",
"color": "Green"
}
},
"type": "list",
"title": "Green"
},
{
"type": "divider"
},
{
"type": "list",
"title": "Blue",
"event": {
"languageCode": "en",
"name": "COLOR",
"parameters": {
"name": "$given-name",
"color": "Blue"
}
}
}
]
]
}Étape 6 : déplacer les paramètres de Dialogflow entre les intentions
Revenez au menu principal Intents et cliquez sur Créer une intention. Donnez un nom à votre nouvelle intention et saisissez COLOR dans la section des événements avant d'appuyer sur Entrée.
Rendez-vous dans la section Phrases d'entraînement et ajoutez un nom et une couleur à la liste des phrases pour déclencher la création de nouveaux paramètres. Remplacez l'entité de paramètre @sys.person par une entité @sys.given-name et assurez-vous que l'entité de couleur est définie sur @sys.color. fort>.
Vous pouvez maintenant ajouter des réponses en utilisant $given-name et $color pour que les entrées de l'utilisateur apparaissent dans la fenêtre de discussion.
Enfin, revenez à la section Contextes en haut de la page et ajoutez une sortie avec un nom unique. Cela transmettra les paramètres de cette intention au suivant.
Étape 7 : Collectez le pays et le numéro de téléphone de l'utilisateur en tant que paramètres Dialogflow
Revenez au menu principal Intents, passez la souris sur l'Intent de couleur que vous venez de créer et cliquez sur Ajouter une intention de suivi. Vérifiez la section Contextes de la nouvelle intention. Assurez-vous qu'il inclut le contexte Color que vous avez créé à la dernière étape dans les sections d'entrée et de sortie. Ajoutez un autre contexte de sortie pour l'intention actuelle.
Accédez à la section Phrases de formation et ajoutez le nom d'un pays à la liste avant d'appuyer sur Entrée. Cela créera un nouveau paramètre. Modifiez le type d'entité du paramètre en @sys.geo-country avant d'ajouter le paramètre à la section de réponse.
Revenez au menu principal Intents et créez une nouvelle intention de suivi pour l'intention que vous venez de créer. Répétez les étapes que vous venez de suivre, mais utilisez un numéro de téléphone dans la section Phrases de formation. Assurez-vous que le paramètre généré a un type d'entité @sys.phone-number.
Revenez au menu principal Intents et créez deux nouvelles intentions de suivi pour l'intention que vous venez de créer ; une intention de suivi Oui et Non. Vous pouvez définir l'intention Aucun suivi pour mettre fin à la conversation.
L'intention de suivi Oui doit contenir tous les contextes des intentions précédentes que vous avez créées.
Enfin, revenez au menu principal Intents et créez une nouvelle intention de suivi pour l'intention de suivi Oui que vous venez de créer. Ajoutez une adresse e-mail à la section Phrases de formation et assurez-vous que le paramètre généré a @sys.email comme type d'entité.
Accédez à la section Réponses, cliquez sur Ajouter des réponses et sélectionnez Charge utile personnalisée dans la liste. Le code JSON suivant ajoutera une réponse riche de type liste qui appelle un événement appelé SENDEMAIL. Tous les paramètres utilisateur que vous avez demandés jusqu'à présent seront envoyés à cette intention.
{
"richContent": [
[
{
"title": "Send Email",
"event": {
"parameters": {
"name": "#Color-followup.name",
"country": "#Color-country-followup.country",
"email": "$email",
"color": "#Color-followup.color",
"phone": "#Color-country-phonenum-followup.phone-number"
},
"name": "SENDEMAIL",
"languageCode": "en"
},
"type": "list"
}
]
]
}Étape 8 : envoyer un e-mail à l'aide de l'éditeur en ligne Dialogflow Node.js
Cliquez sur Créer une intention dans le menu principal des intentions. Ajoutez SENDEMAIL à la section Événements et appuyez sur Entrée. Suivez ceci en ajoutant tous les paramètres que vous avez collectés à la section Action et paramètres.
Accédez à la section Fulfillment en bas de la page et activez le curseur intitulé Activer l'appel webhook pour cette intention. Cela vous permettra d'ajouter du code personnalisé à cette intention.
Sélectionnez Fulfillment dans le menu principal à gauche de la page et activez le curseur pour activer l'éditeur en ligne. Vous devrez peut-être ajouter un compte de facturation à votre projet Google pour ce faire.
Cliquez sur l'onglet package.json et faites défiler vers le bas du fichier. Remplacez la section dépendances par le code suivant pour ajouter l'API Nodemailer à votre projet.
"dependencies": {
"actions-on-google": "^2.2.0",
"firebase-admin": "^5.13.1",
"firebase-functions": "^2.0.2",
"dialogflow": "^0.6.0",
"nodemailer": "^4.4.2",
"dialogflow-fulfillment": "^0.5.0"
}
Revenez au fichier index.js et remplacez le code existant par l'exemple trouvé sur ce projet CodePen avant de cliquer sur Déployer. Vous devrez remplacer les identifiants Gmail par ceux de votre propre compte. Vous devez utiliser un mot de passe d'application pour cela. Une fois terminé, votre chatbot enverra par e-mail tous les détails que vous collectez à l'utilisateur à la fin d'une conversation réussie. Vous pouvez en savoir plus sur Node.js et comment l'utiliser avec notre guide pratique.
Utiliser Dialogflow ES sur votre site Web
Votre nouveau chatbot peut collecter des informations sur les utilisateurs et envoyer des e-mails, mais Dialogflow ES peut faire bien plus. Vous pouvez connecter à peu près n'importe quelle API à ce service et vous pouvez utiliser l'API Dialogflow pour contrôler votre chatbot sur votre propre site Web.