Übung: Erweitern und Optimieren von Nachrichtenerweiterungen für die Verwendung mit Microsoft 365 Copilot

Abgeschlossen

In dieser Übung erweitern und optimieren Sie Ihre Nachrichtenerweiterung für die Verwendung mit Microsoft 365 Copilot. Sie fügen einen neuen Parameter namens Target Audience hinzu und aktualisieren die Nachrichtenerweiterungslogik, um mehrere Parameter zu verarbeiten. Schließlich führen Sie Ihre Nachrichtenerweiterung aus und debuggen sie und testen sie in Copilot in Microsoft Teams.

Screenshot einer Antwort in Microsoft 365 Copilot, die vom Nachrichtenerweiterungs-Plug-In zurückgegebene Informationen enthält. Es wird eine adaptive Karte mit Produktinformationen angezeigt.

App-Beschreibung aktualisieren

Die Angabe präziser und genauer Beschreibungen in Ihrem App-Manifest ist entscheidend, um sicherzustellen, dass Copilot weiß, wann und wie Ihr Plugin aufgerufen werden muss. Aktualisieren Sie die Beschreibungen der App, des Befehls und der Parameter im App-Manifest.

Öffnen Sie Visual Studio und im Projekt TeamsApp:

  1. Öffnen Sie im Ordner appPackagemanifest.json

  2. Aktualisieren des Beschreibungsobjekts

    {
        "description": {
            "short": "Product look up tool.",
            "full": "Get real-time product information and share them in a conversation. Search by product name or target audience. ${{APP_DISPLAY_NAME}} works with Microsoft 365 Chat. Find products at Contoso. Find Contoso products called mark8. Find Contoso products named mark8. Find Contoso products related to Mark8. Find Contoso products aimed at individuals. Find Contoso products aimed at businesses. Find Contoso products aimed at individuals with the name mark8. Find Contoso products aimed at businesses with the name mark8."
        },
    }
    

Hinzufügen eines neuen Parameters

Fügen Sie einen neuen Parameter hinzu, den Copilot verwenden kann. Dieser neue Parameter hilft Benutzern bei der Suche nach Produkten mit Copilot, die sich an verschiedene Zielgruppen wie Einzelpersonen und Unternehmen richten.

Fortfahren in Visual Studio und im TeamsApp-Projekt:

  1. Fügen Sie im Parameterarray den Parameter TargetAudience nach dem ProductName-Parameter hinzu.

    {    
        "parameters": [
            {
                "name": "ProductName",
                "title": "Product name",
                "description": "The name of the product as a keyword",
                "inputType": "text"
            },
            {
                "name": "TargetAudience",
                "title": "Target audience",
                "description": "Audience that the product is aimed at. Consumer products are sold to individuals. Enterprise products are sold to businesses",
                "inputType": "text"
            }
        ]
    }
    
  2. Save your changes

Die Beschreibung des TargetAudience-Parameters beschreibt, was es ist, und erklärt, dass der Parameter zulässige Consumer- oderEnterprise-Werte akzeptieren sollte.

Aktualisieren Sie als Nächstes die Befehlsbeschreibung, um den neuen Parameter einzuschließen.

  • Aktualisieren Sie im Befehlsarray die Beschreibung des Befehls.

    {
        "commands": [
            {
                "id": "Search",
                "type": "query",
                "title": "Products",
                "description": "Find products by name or by target audience",
                "initialRun": true,
                "fetchTask": false,
                "context": [...],
                "parameters": [...]
            }
        ]
    }
    

Aktualisieren der Nachrichtenerweiterungslogik

Um den neuen Parameter zu unterstützen und komplexe Eingabeaufforderungen zu unterstützen, aktualisieren Sie die OnTeamsMessagingExtensionQueryAsync-Methode im Bot-Aktivitätshandler, um mehrere Parameter zu verarbeiten.

Aktualisieren Sie zunächst die ProductService-Klasse, um Produkte basierend auf den Parametern name und audience abzurufen.

Fortfahren in Visual Studio im Projekt ProductPlugin:

  1. Öffnen Sie im Ordner DiensteProductsService.cs

  2. Erstellen Sie in der Datei neue Methoden namens GetProductsByCategoryAsync und GetProductsByNameAndCategoryAsync.

    internal async Task<Product[]> GetProductsByCategoryAsync(string category)
    {
        var response = await _httpClient.GetAsync($"{_baseUri}products?category={category}");
        response.EnsureSuccessStatusCode();
        var jsonString = await response.Content.ReadAsStringAsync();
        return System.Text.Json.JsonSerializer.Deserialize<Product[]>(jsonString);
    }
    
    internal async Task<Product[]> GetProductsByNameAndCategoryAsync(string name, string category)
    {
        var response = await _httpClient.GetAsync($"{_baseUri}?name={name}&category={category}");
        response.EnsureSuccessStatusCode();
        var jsonString = await response.Content.ReadAsStringAsync();
        return System.Text.Json.JsonSerializer.Deserialize<Product[]>(jsonString);
    }
    
  3. Save your changes

Fügen Sie als Nächstes der MessageExtensionHelper-Klasse eine neue Methode hinzu, um Produkte basierend auf den Parametern name und audience abzurufen.

  1. Öffnen Sie im Ordner HilfsprogrammeMessageExtensionHelper.cs

  2. Erstellen Sie in der Datei eine neue Methode mit dem Namen RetrieveProducts , die Produkte basierend auf dem Namen und den Zielgruppenparametern abruft.

    internal static async Task<IList<Product>> RetrieveProducts(string name, string audience, ProductsService productsService)
    {
        IList<Product> products;
    
        if (string.IsNullOrEmpty(name) && !string.IsNullOrEmpty(audience))
        {
            products = await productsService.GetProductsByCategoryAsync(audience);
        }
        else if (!string.IsNullOrEmpty(name) && string.IsNullOrEmpty(audience))
        {
            products = await productsService.GetProductsByNameAsync(name);
        }
        else if (!string.IsNullOrEmpty(name) && !string.IsNullOrEmpty(audience))
        {
            products = await productsService.GetProductsByNameAndCategoryAsync(name, audience);
        }
        else
        {
            products = [];
        }
    
        return products;
    }
    
  3. Save your changes

Die RetrieveProduct-Methode ruft Produkte basierend auf dem Namen und den Zielgruppenparametern ab. Wenn der name-Parameter leer und der audience-Parameter nicht leer ist, ruft die Methode Produkte basierend auf dem audience-Parameter ab. Wenn der name-Parameter nicht leer und der audience-Parameter leer ist, ruft die Methode Produkte basierend auf dem name-Parameter ab. Wenn sowohl der Name als auch der Zielgruppenparameter nicht leer sind, ruft die Methode Produkte basierend auf beiden Parametern ab. Wenn beide Parameter leer sind, gibt die Methode eine leere Liste zurück.

Aktualisieren Sie als Nächstes die SearchApp-Klasse , um den neuen Parameter zu behandeln.

  1. Öffnen Sie im Ordner "Suche" SearchApp.cs

  2. Ersetzen Sie in der OnTeamsMessagingExtensionQueryAsync-Methode den folgenden Code:

    var name = MessageExtensionHelpers.GetQueryParameterValueByName(query.Parameters, "ProductName");
    
    var productService = new ProductsService(tokenResponse.Token);
    var products = await productService.GetProductsByNameAsync(name);
    

    Durch:

    var name = MessageExtensionHelpers.GetQueryParameterValueByName(query.Parameters, "ProductName");
    var audience = MessageExtensionHelpers.GetQueryParameterValueByName(query.Parameters, "TargetAudience");
    
    var productService = new ProductsService(tokenResponse.Token);
    var products = await MessageExtensionHelpers.RetrieveProducts(name, audience, productService);
    
  3. Save your changes

Die OnTeamsMessagingExtensionQueryAsync-Methode ruft jetzt die Parameter name und audience aus den Abfrageparametern ab. Anschließend werden Produkte basierend auf dem Namen und den Zielgruppenparametern mithilfe der RetrieveProducts-Methode abgerufen.

Erstellen und Aktualisieren von Ressourcen

Wenn alles vorhanden ist, führen Sie den Prozess Vorbereiten von Teams-App-Abhängigkeiten aus, um neue Ressourcen zu erstellen und vorhandene ressourcen zu aktualisieren.

Fahren Sie in Visual Studio fort:

  1. Klicken Sie in Projektmappen-Explorer mit der rechten Maustaste auf das Projekt TeamsApp.
  2. Erweitern Sie das Menü Teams Toolkit, wählen Sie Teams-App-Abhängigkeiten vorbereiten
  3. Wählen Sie im Dialogfeld Microsoft 365-KontoWeiteraus.
  4. Wählen Sie im Dialogfeld Bereitstellen die Option Bereitstellenaus.
  5. Wählen Sie im Warndialogfeld Teams ToolkitBereitstellenaus.
  6. Wählen Sie im Dialogfeld Informationen zum Teams-Toolkit das Kreuzsymbol aus, um das Dialogfeld zu schließen.

Ausführen und Debuggen

Starten Sie mit den bereitgestellten Ressourcen eine Debugsitzung, um die Nachrichtenerweiterung zu testen.

Starten Sie zunächst den Dev-Proxy, um die benutzerdefinierte API zu simulieren.

  1. Öffnen eines Terminalfensters

  2. Führen Sie den folgenden Befehl aus, um den Dev Proxy zu starten:

    devproxy --config-file "~appFolder/presets/learn-copilot-me-plugin/products-api-config.json"
    
  3. Wenn Sie dazu aufgefordert werden, akzeptieren Sie die Zertifikatwarnung.

Hinweis

Wenn Dev Proxy ausgeführt wird, fungiert er als systemweiter Proxy.

Starten Sie als Nächstes eine Debugsitzung in Visual Studio:

  1. Um eine neue Debugsitzung zu starten, drücken Sie F5 , oder wählen Sie auf der Symbolleiste Start aus.

  2. Warten Sie, bis ein Browserfenster geöffnet wird und das Dialogfeld für die App-Installation im Microsoft Teams-Webclient angezeigt wird. Wenn Sie dazu aufgefordert werden, geben Sie die Anmeldeinformationen Ihres Microsoft 365-Kontos ein.

  3. Wählen Sie im Dialogfeld „App-Installation“ Hinzufügen aus

  4. Öffnen der Copilot-App in Microsoft Teams

  5. Öffnen Sie im Nachrichtenbereich zum Verfassen das Flyout Plug-Ins .

  6. Schalten Sie in der Liste der Plug-Ins das Contoso-Produkt-Plug-In um, um es zu aktivieren.

    Screenshot: Microsoft 365 Copilot in Microsoft Teams mit aktiviertem Contoso-Produkt-Plug-In

  7. Geben Sie "Contoso-Produkte für Einzelpersonen suchen " als Nachricht ein, und senden Sie sie.

  8. Warten, bis Copilot antwortet

    Screenshot: Microsoft 365 Copilot in Microsoft Teams mit der Copilot-Nachricht, die beim Verarbeiten der Anforderung des Benutzers angezeigt wird.

  9. In der Copilot-Antwort werden die in der Plug-In-Antwort zurückgegebenen Daten angezeigt, und in der Antwort wird auf das Plug-In verwiesen.

    Screenshot einer Antwort in Microsoft 365 Copilot, die vom Nachrichtenerweiterungs-Plug-In zurückgegebene Informationen enthält. Es wird eine adaptive Karte mit Produktinformationen angezeigt.

  10. Um die für das Ergebnis relevante adaptive Karte anzuzeigen, zeigen Sie auf die Verweise in der Copilot-Antwort.

    Screenshot: Microsoft 365 Copilot in Microsoft Teams mit einer adaptiven Karte mit angezeigten Produktinformationen Die Karte wird angezeigt, wenn der Benutzer in der Copilot-Antwort auf einen Verweis zeigt.

Kehren Sie zu Visual Studio zurück, und wählen Sie auf der Symbolleiste Beenden aus, oder drücken Sie UMSCHALT + F5 , um die Debugsitzung zu beenden. Fahren Sie außerdem den Dev-Proxy mit STRG + C herunter.