Chatvorlagen mit Web App Bot in Microsoft Teams erstellen
Das neue Microsoft Teams Plug-in soll Vorlagen für Mitarbeiterinnen und Mitarbeiter zur Verfügung stellen, die jederzeit im Chat verschickt werden können. Somit lassen sich auch während eines Anrufs bequem Nachrichten versendet werden. Man suche nur noch nach der richtigen Vorlage, klickt auf die Schaltfläche und verschickt im Handumdrehen sein selbst erstelltes Chat-Template. Wir zeigen, wie das Web App Bot in Microsoft Teams eingesetzt wird.
Web App Bot im Azure Portal erstellen
1. Klick auf die Schaltfläche „Ressource erstellen“, dann „KI + Machine Learning“ und als letztes auf den „Web App Bot“.
2. Den Namen des Web App Bot im Eingabefeld „Bot-Handle“ eintragen (dieser Name ist später editierbar) und bei „App-Name“ den App-Service benennen (Endpunkt-URL).
3. In der Auswahl „Bot-Vorlage“ den Echo Bot (C#) auswählen, dann alle weiteren Pflichtfelder ausfüllen und als letztes auf die Schaltfläche „Erstellen“ klicken.
4. Klick auf die Schaltfläche „Alle Ressourcen“ und suche nach dem erstellten Web App Bot
5. Klick auf die Schaltfläche „Erstellen“ und dann auf „Bot-Quellcode herunterladen“
Grundfunktionen des Bots in C# programmieren
Voraussetzung
- Framework: ASP.NET Core 3.1, Microsoft.Bot.Builder.Integration.AspNet.Core 4.8.0
- Microsoft.EntityFrameworkCore.Cosmos 5.0.0
Methode für die Auflistung und das Auffinden der Vorlagen
- „SearchCards“ ist der Parameter für das Sucheingabefeld in Teams und „newFilter“ ist ein String für den Suchbegriff
- „HerocCard“ ist das Format der Vorlagen. Diese werden auf die Parameter „filter“ und „tenant-id“ überprüft (Die TenantId ist die Zugriff-ID der Teams Organisation)
- Das Objekt „MessagingExtensionResult“ listet alle HeroCard-Attachments auf, die mit den Parametern übereinstimmen und es wird als MessagingExtensionResponse zurückgegeben.
public class TeamsMessagingExtensionsActionBot : TeamsActivityHandler {
protected override async Task
OnTeamsMessagingExtensionQueryAsync
(ITurnContext turnContext, MessagingExtensionQuery
query, ancellationToken cancellationToken)
{
var filter = "";
if (query.Parameters != null) {
}
var newFilter = query.Parameters.FirstOrDefault(p => p.Name == "SearchCards");
if (newFilter != null) {
filter = newFilter.Value.ToString(); }
}
string tenantId = turnContext.Activity.ChannelData.tenant.id; var functionresult = GetHeroCardAttachments(filter, tenantId); var messageResults = new MessagingExtensionResponse
{
ComposeExtension = new MessagingExtensionResult {
Type = "result",
AttachmentLayout = "list", Attachments = functionresult.Result
}
};
return messageResults;
Methode für das Erstellen und Löschen der Vorlage
- „createCard“ und „removeCard“ sind die Parameter für die Aktionen in Teams
- Die Chatvorlagen werden in diesem Beispiel in einer Azure Cosmos DB gespeichert
- Wenn eine Karte gelöscht worden ist, meldet sich der Bot, dass der Vorgang abgeschlossen ist.
protected override async Task
OnTeamsMessagingExtensionSubmitActionAsync
(ITurnContext turnContext, MessagingExtensionAction
action, CancellationToken cancellationToken)
{
switch (action.CommandId) {
// These commandIds are defined in the Teams App Manifest.
case "createCard":
var createCardData =
((JObject)action.Data).ToObject();
string tenantId = turnContext.Activity.ChannelData.tenant.id;
createKachelInCosmosDb(tenantId, createCardData.Subject, createCardData.Body);
return null;
case "removeCard":
var createCardData2 = ((JObject)action.Data).ToObject(); abgeschlossen");
string tenantId2 = turnContext.Activity.ChannelData.tenant.id; var isremoved = removeKachelInCosmosDb(tenantId2, createCardData2.Subject, createCardData2.Body);
if (isremoved)
{
MessagingExtensionActionResponse response = new MessagingExtensionActionResponse();
response.ComposeExtension = new MessagingExtensionResult() { Type = "message", Text = "Die Vorlage wurde erfolgreich entfernt" };
await turnContext.SendActivityAsync("Vorgang
return response;
}
return null;
default:
throw new NotImplementedException($"Invalid CommandId: {action.CommandId}");
} }
Dies sind die Attribute für die Chatvorlagen als Model
public class ChatVorlage
{
[Key]
public Guid Id { get; set; }
public string TenantId { get; set; }
public string ChannelId { get; set; }
public string Subject { get; set; }
public string Body { get; set; }
}
Hier werden die Chatvorlagen aus der Azure Cosmos Datenbank abgerufen und in einer einfachen Liste gespeichert
private List GetCardsFromCosmosDb(string filter, string tenantId)
{
var cardsList = new List();
using (var dbContext = new chatVorlagenDbContext()) {
List cosmosVorlagen;
if (string.IsNullOrWhiteSpace(filter))
cosmosVorlagen = dbContext.ChatVorlagen.ToList();// Where(vo => vo.TenantId == tenantId).ToList();
else
cosmosVorlagen = dbContext.ChatVorlagen.Where(vo => vo.TenantId == tenantId && vo.Subject != null && vo.Subject.Contains(filter)).ToList();
foreach (var vorlage in cosmosVorlagen)
{
var heroCard = new ThumbnailCard() {
Title = vorlage.Subject, Text = vorlage.Body, };
Attachment attachment = new Attachment() {
ContentType = ThumbnailCard.ContentType, Content = heroCard };
MessagingExtensionAttachment messagingExtensionAttachment =
new MessagingExtensionAttachment()
{
ContentType = HeroCard.ContentType, Content = heroCard, Preview = attachment,};
cardsList.Add(messagingExtensionAttachment); }
}
return cardsList;
Im folgenden Codefragment wird die Liste der Chatvorlagen in das richtige Ausgabeformat MessagingExtensionAttachments konvertiert
private async Task<List>
GetHeroCardAttachments(string filter, string tenantId)
{
var attachments = new List(); var cardsList = GetCardsFromCosmosDb(filter, tenantId);
foreach (var card in cardsList)
{
attachments.Add(card); return attachments;
}
Teams Bot im App Studio einrichten und mit Azure verbinden
Klick auf die Schaltfläche „Apps“ in Microsoft Teams, suche nach dem „App Studio“ im Eingabefeld und mache einen Download durch einen Klick auf die Schaltfläche „Herunterladen“
Klick auf die Schaltfläche „App Studio“, dann auf „Manifest editor“ und zum Schluss auf „Create a new app“
Erstelle einen „Namen“ und eine „ID“ für die App. Danach müssen alle weiteren Pflichtfelder ausgefüllt werden.
Klicke auf die Schaltfläche „Bots“ und erstelle einen Bot mit dem Messaging End Point des Azure Web App Bot, den man im Portal in der Übersicht findet
Klick auf „Messaging Extension“ und übernehme die Einstellungen des Bots
Klick auf die Schaltfläche „Add“ bei Command und erstelle eine Query
Benenne die Pflichtfelder beim Query-Command mit „SeachCards“. Beachte Groß- und Kleinschreibung
Klick auf die Schaltfläche „Add“ bei Command und erstelle Actions
Benenne die Command-IDs bei den Action-Commands mit „createCard“ und „removeCard“. Beachte die Groß- und Kleinschreibung
Füge zu den beiden Action-Commands die Parameter „Subject“ und „Body“ hinzu
Als letztes muss die Teams-App installiert werden. Klicke hierfür auf „Test and distribute“ und dann auf „Install“
„Azure Web App Bot“ mit Microsoft Teams verbinden. Dabei ist wichtig, dass der richtige Bot in Teams eingestellt ist.