Création d'un Chatbot Azure à l'aide de Microsoft Bot Framework

Apprenez à créer rapidement un chatbot avec Bot Framework et connectez-le au contrôle RadChat dans Telerik UI pour WinForms.

Chaque voyage a un point de départ et celui-ci commence à azure.com . La première chose dont nous avons besoin est un compte Microsoft et un abonnement Azure. Si vous en avez déjà un, vous pouvez l'utiliser. Si vous ne le faites pas, vous pouvez en créer un gratuitement.

Déploiement de l'application Bot

Une fois que nous avons notre compte et notre abonnement, notre voyage se rend au portail Azure . Ici, nous allons créer et gérer l'application pour notre bot. Nous pouvons même éditer le code source de notre robot directement dans le navigateur, mais ne nous laissons pas devancer. Tout d'abord, allez dans "Créer une ressource" (1). Si c'est votre première fois sur le portail, vous aurez l'option dans votre tableau de bord, dans tous les cas, vous pouvez utiliser le bouton dans le menu sur le côté gauche. Le type de ressource qui nous intéresse est appelé "Web App Bot" (4) qui se trouve dans le groupe "AI + Machine Learning" (2). Notez que cliquer sur (3) est optionnel mais vous aidera à comprendre la fenêtre suivante.

A l'étape suivante, remplissez les champs obligatoires et laissez le Template Bot sur "Basic (C # ), "Puis cliquez sur Créer. Cela créera un bot d'écho qui répètera tous les messages que nous lui enverrons.

Dans quelques instants, l'application bot sera déployée et nous serons prêts pour la chaîne

Activation du canal DirectLine

Lorsque nous ouvrons notre application nouvellement créée, la seule façon de l'atteindre est le chat Web. Pour activer DirectLine, qui sera notre canal de communication, cliquez sur l'option Canaux (1) puis sur le bouton DirectLine (2).

Après avoir activé le canal, la boîte de dialogue des paramètres du canal ouvrira. Puisque nous sommes là et que nous sommes sur le point d'en finir avec la partie du projet du côté du portail Azure, vous pouvez appuyer sur show (1) sur l'une ou l'autre clé secrète, puis copier le secret dans la zone de texte. À la fin, appuyez sur Terminé (3) et la configuration est terminée.

Si vous avez besoin de revenir à cette boîte de dialogue, vous pouvez cliquer sur le bouton Modifier dans la liste des chaînes. 19659003] Connexion du contrôle de l'interface de conversation

Nous allons maintenant créer un nouveau projet WinForms dans Visual Studio et ouvrir le fichier app.config. A l'intérieur, nous placerons le secret que nous venons de copier et l'identifiant du bot. L'identifiant du bot sera généralement le même que le nom de votre application, mais pour être prudent, vous pouvez accéder aux paramètres de l'application dans les options de votre application et faire défiler les options – vous devriez pouvoir le trouver. Voici à quoi ressemble app.config:

  
     <add key = "DirectLineSecret" value = "" />
    
  
  
    
  

Nous devons maintenant ajouter des références aux assemblages nécessaires. Accédez à l'Explorateur de solutions de Visual Studio, cliquez avec le bouton droit sur le nouveau projet et cliquez sur "Gérer les packages NuGet". Dans la section "Parcourir", recherchez "Microsoft.Bot.Connector.DirectLine" et cliquez sur installer. Puis répétez pour le paquet "websocket-sharp". Après avoir installé les paquets NuGet, vous pouvez mettre à jour ceux qui ont des versions plus récentes si vous le souhaitez.

Ensuite, nous plaçons un contrôle RadChat sur le formulaire principal et nous pouvons commencer à écrire du code.

. Je vais placer tout le code et expliquer le but de celui-ci ci-dessous:

 chaîne de caractères readonly privée directLineSecret = ConfigurationManager.AppSettings ["DirectLineSecret"];
chaîne de lecture privée privée botId = ConfigurationManager.AppSettings ["BotId"];
 
WebSocket WebSocketClient privé;
private DirectLineClient directLineClient;
conversation Conversation privée;
 
private Author client = new Auteur (null, "Client", "ClientId");
Auteur privé bot = new Auteur (null, "Rad Bot"); 

Les deux premières lignes lisent les paramètres que nous avons placés dans le fichier app.config et les stockent dans des variables. Le client de socket Web est utilisé pour écouter les messages du serveur. Le client de ligne directe aide à démarrer la conversation et à envoyer des messages au serveur. La conversation est utilisée pour contenir des informations pour la conversation en cours. Les deux auteurs sont là pour que RadChat puisse afficher correctement les messages des deux parties.

Ensuite, nous avons le code d'initialisation dans le constructeur du formulaire. Encore une fois, voici le code et l'explication suivante:

 public Form1 ()
{
  InitializeComponent ();

  Conversation tokenResponse = new DirectLineClient (directLineSecret) .Tokens.GenerateTokenForNewConversation ();
  this.directLineClient = new DirectLineClient (tokenResponse.Token);
  this.conversation = directLineClient.Conversations.StartConversation ();

  this.webSocketClient = nouveau WebSocket (conversation.StreamUrl);
  this.webSocketClient.OnMessage + = WebSocketClient_OnMessage;
  this.webSocketClient.Connect ();

  this.radChat1.Author = this.client;
  this.radChat1.ChatElement.SendMessage + = this.ChatElement_SendMessage;
} 

Ici, nous avons le code standard pour démarrer une conversation via l'API DirectLine, puis nous avons le code pour recevoir les messages du serveur et enfin le code pour obtenir les messages utilisateur de RadChat. Notez que nous définissons l'auteur du client sur le contrôle de chat afin que RadChat sache qui est l'auteur des messages écrits dans son champ de saisie.

Considérons maintenant le code pour recevoir les messages du serveur et les afficher dans le contrôle de chat:

 private void WebSocketClient_OnMessage (expéditeur d'objet, MessageEventArgs e)
{
  // Occasionnellement, le service Direct Line envoie un message vide en tant que ping d'activité. Ignorer ces messages.
  if (string.IsNullOrWhiteSpace (e.Data))
  {
    revenir;
  }

  if (this.radChat1.InvokeRequired)
  {
    this.Invoke (new MethodInvoker (délégué {this.AddMessageToChat (e.Data);}));
  }
  autre
  {
    this.AddMessageToChat (e.Data);
  }
}

AddMessageToChat void privé (données de chaîne)
{
  var activitySet = JsonConvert.DeserializeObject  (données);
  var activities = de x dans activitySet.Activities
                   où x.From.Id == botId
                   sélectionnez x;

  foreach (Activité dans les activités)
  {
    if (activity.Type == ActivityTypes.Message &&! string.IsNullOrEmpty (activity.Text))
    {
      this.radChat1.ChatElement.AddMessage (nouveau ChatTextMessage (activity.Text, this.bot, DateTime.Now));
    }
  }
} 

Ici, il s'agit d'obtenir les bons éléments du JSON que l'application web envoie et ensuite d'ajouter le message à RadChat.

La dernière partie du code traite de l'envoi de messages de l'utilisateur via RadChat au serveur:

 private void ChatElement_SendMessage (expéditeur d'objet, SendMessageEventArgs e)
{
  chaîne message = ((ChatTextMessage) e.Message) .Message;

  Activity userMessage = nouvelle activité
  {
    De = new ChannelAccount (nom: this.client.Name),
    Texte = message,
    Type = ActivityTypes.Message
  }

  directLineClient.Conversations.PostActivityAsync (conversation.ConversationId, userMessage);
} 

Avec ceci, notre voyage se termine. Toutes les étapes et le code pour avoir un chatbot fonctionnel nous ont amenés ici et maintenant nous pouvons démarrer l'application et envoyer un message au bot dont il devrait lui faire écho.

Mots de fermeture et prochaines étapes

J'espère que vous avez trouvé cet article intéressant et qu'il vous aide à configurer votre premier chatbot. Le contrôle RadChat utilisé dans la dernière section est disponible via l'interface utilisateur Telerik pour WinForms . Vous pouvez trouver la documentation relative à et n'hésitez pas à partager vos impressions via notre portail de commentaires .

Si vous êtes nouveau sur Telerik UI pour WinForms, vous pouvez consulter le ] Application de démonstration et Exemples d'applications ou essayez les contrôles gratuitement pendant 30 jours.