Automatisch eine Chatbot-Unterhaltung starten

  • Artikel

Wichtig

Power Virtual Agents-Fähigkeiten und -Funktionen sind jetzt Teil von Microsoft Copilot Studio nach erheblichen Investitionen in generative KI und verbesserte Integrationen in Microsoft Copilot.

Einige Artikel und Screenshots beziehen sich möglicherweise auf Power Virtual Agents während wir Dokumentation und Schulungsinhalte aktualisieren.

Sie können Ihren Bot so konfigurieren, dass er eine Unterhaltung mit einem Benutzer beginnt. Sie können die benutzerdefinierte Begrüßung auch mit Anpassung an das Erscheinungsbild des Bots kombinieren.

Wichtig

Wenn der Bot das Gespräch startet, wird dies in Ihrer Analyse angezeigt und erhöht Ihre Sitzungsanzahl.

Wenn der Benutzer Ihres Bots nicht mit dem Bot in Kontakt tritt (zum Beispiel lädt er die Seite, fragt den Bot aber nichts), wird die Sitzung als nicht aktivierte Sitzung markiert. Dies kann sich auf Ihre Analyse auswirken.

Standardmäßig werden mit Microsoft Copilot Studio erstellte und auf einer Website veröffentlichte Chatbots ohne Begrüßung geladen, die passiv darauf warten, dass der Benutzer die Konversation startet.

Sie können jedoch benutzerdefinierte CSS und JavaScript-Code verwenden, damit der Bot die Konversation automatisch startet, wenn der Bot geladen wird. Zum Beispiel könnte Ihr Bot sagen: „Hallo, ich bin Botty, ein virtueller Agent“, sobald der Bot geladen wird.

Zunächst müssen Sie einen benutzerdefinierten Canvas bereitstellen, der Argumente enthält, die die Begrüßung auslösen. Standardmäßig ruft der benutzerdefinierte Canvas das Standardsystembegrüßungsthema auf. Sie können jedoch ein neues Thema erstellen, das als Begrüßung verwendet wird. Sie müssen jedoch das Standardsystembegrüßungsthema in ein neues Thema umleiten.

Wichtig

Sie dürfen den in dieser Dokumentation enthaltenen Beispielcode nur zur Verwendung mit Microsoft Copilot Studio Produkte verwenden. Der Beispielcode ist „wie besehen“ lizenziert und von Service Level Agreements oder Supportservices ausgeschlossen. Sie tragen das volle Risiko der Verwendung.

Microsoft gibt keine ausdrücklichen Gewährleistungen, Garantien oder Bedingungen und schließt ausdrücklich sämtliche stillschweigenden Gewährleistungen der Handelsüblichkeit, Eignung für einen bestimmten Zweck und Nichtverletzung von Rechten Dritter aus.

Tokenendpunktdetails abrufen

Um Ihren Canvas anzupassen, unabhängig davon, ob es sich um den Standard-Canvas oder einen benutzerdefinierte Canvas handelt, mit dem Sie eine Verbindung herstellen, müssen Sie Ihre Bot-Details abrufen.

  1. Wählen Sie im Navigationsmenü unter Einstellungen die Option Kanäle.

  2. Wählen Sie mobile App.

    Screenshot der Mobile-App-Kachel.

  3. Wählen Sie neben Token-EndpunktKopieren aus.

    Screenshot der Endpunkt-Token-ID.

Anpassen des Standard-Canvas (einfach)

Sie können mit einigen einfachen CSS und JavaScript-Styling-Optionen konfigurieren, wie der Chat-Canvas aussieht.

Zunächst müssen Sie konfigurieren, wo Sie Ihren Bot-Canvas bereitstellen.

  1. Erstellen und veröffentlichen Sie einen Bot.

  2. Kopieren Sie den folgenden HTML-Code, fügen Sie ihn ein und speichern Sie ihn unter index.html.
    Sie können den folgenden Code auch kopieren und in den w3schools.com-HTML-try it-Editor einfügen. Sie müssen noch Ihren Token-Endpunkt hinzufügen.

    <!DOCTYPE html>
<html>
<head>
    <title>Contoso Sample Web Chat</title> 
    <!-- This styling is for the Web Chat demonstration purposes. It is recommended that style is moved to a separate file for organization in larger projects -->
    <style>
        html, body {
            height: 100%;
        }

        body {
            margin: 0;
        }

        h1 {
            font-size: 16px;
            font-family: Segoe UI;
            line-height: 20px;
            color: whitesmoke;
            display: table-cell;
            padding: 13px 0px 0px 20px;
        }

        #heading {
            background-color: black;
            height: 50px;
        }

        .main {
            margin: 18px;
            border-radius: 4px;
        }

        div[role="form"]{
            background-color: black;
        }

        #webchat {
            position: fixed;
            height: calc(100% - 50px);
            width: 100%;
            top: 50px;
            overflow: hidden;
        }

    </style>

</head>
<body>
    <div>
        <div id="heading">
            <!-- Change the h1 text to change the bot name -->    
            <h1>Contoso Bot Name</h1>
        </div>
        <div id="webchat" role="main"></div>
    </div>    

  <script src="https://cdn.botframework.com/botframework-webchat/latest/webchat.js"></script>

  <script>
        const styleOptions = {

           // Add styleOptions to customize Web Chat canvas
           hideUploadButton: true
        };

        // Add your BOT token endpoint below
        var theURL = "<BOT TOKEN ENDPOINT>";

        var environmentEndPoint = theURL.slice(0,theURL.indexOf('/powervirtualagents'));
        var apiVersion = theURL.slice(theURL.indexOf('api-version')).split('=')[1];
        var regionalChannelSettingsURL = `${environmentEndPoint}/powervirtualagents/regionalchannelsettings?api-version=${apiVersion}`; 

        var directline;
            fetch(regionalChannelSettingsURL)
                .then((response) => {
                    return response.json();
                    })
                .then((data) => {
                    directline = data.channelUrlsById.directline;
                    })
                .catch(err => console.error("An error occurred: " + err));

      fetch(theURL)
            .then(response => response.json())
            .then(conversationInfo => {
                window.WebChat.renderWebChat(
                    {
                        directLine: window.WebChat.createDirectLine({
                            domain: `${directline}v3/directline`,
                            token: conversationInfo.token,
                        }),
                        styleOptions
                    },
                    document.getElementById('webchat')
                );
            })
            .catch(err => console.error("An error occurred: " + err));

    </script>
  </body>
</html>

  3. Geben Sie in der von Ihnen erstellten Datei index.html Ihren Tokenendpunkt in die Zeile var theURL = "<YOUR TOKEN ENDPOINT>"; ein.

  4. Öffnen Sie index.html mit einem modernen (zum Beispiel Microsoft Edge), um den Bot im benutzerdefinierten Canvas zu öffnen.

  5. Testen Sie den Bot, um sicherzustellen, dass Sie Antworten von Ihrem Bot erhalten und dass er ordnungsgemäß funktioniert.

    Wenn Sie auf Probleme stoßen, stellen Sie sicher, dass Sie Ihren Bot veröffentlicht haben und dass Ihr Token-Endpunkt an der richtigen Stelle eingefügt wurde. Es sollte nach dem Gleichheitszeichen (=) in der Zeile var theURL = "<YOUR TOKEN ENDPOINT>" stehen und von doppelten Anführungszeichen (") umgeben sein.

Ändern der Standardbegrüßung des Bots

Der Code in der Index.html-Datei bewirkt, dass ein Thema automatisch aufgerufen wird, wenn der Bot geladen wird. Standardmäßig wird das Systembegrüßungsthema aufgerufen. Sie können auch ein neues Thema erstellen und das Standardsystembegrüßungsthema auf dieses neue Thema umleiten.

In beiden Fällen nehmen Sie Änderungen an dem Thema vor, das Sie wie gewohnt aufrufen möchten.

Wenn Sie ein neues Begrüßungsthema ändern oder erstellen, empfiehlt es sich, eine Art der Identifizierung anzugeben, dass der Benutzer mit einem Bot (oder „virtuellen Agenten“) spricht, damit er nicht denkt, dass er mit einem Menschen spricht.

Wir empfehlen, dass Sie das Systembegrüßungsthema so ändern, dass Sie den Index.html-Code nicht bearbeiten müssen.

  1. Wählen Sie Themen im Navigationsmenü aus, und wählen Sie dann die Themenzeile Gruß aus.

    Screenshot der Themenseite mit hervorgehobenem Begrüßungsthema.

  2. Bearbeiten Sie den Text in den Knoten Nachricht. Sie können auch zusätzliche Knoten hinzufügen oder löschen.

  3. Wählen Sie Save (Speichern).

  4. Bot veröffentlichen.

Sie können Ihren Bot jetzt testen, indem Sie auf die Webseite gehen, auf der Sie den benutzerdefinierten Canvas Ihres Bots bereitgestellt haben. Sie sehen, wie der Bot die Konversation startet, indem er automatisch das Begrüßungsthema anzeigt.

Erstellen eines neuen Benutzerthemas

Warnung

Die Verwendung eines Benutzerthemas zum Starten einer Konversation erhöht Ihre in Rechnung gestellte Sitzungen. Eine in Rechnung gestellte Sitzung ist eine Interaktion zwischen einem Kunden und einem Bot und repräsentiert eine Verbrauchseinheit. Die in Rechnung gestellte Sitzung beginnt, wenn ein Benutzerthema ausgelöst wird. Weitere Informationen finden Sie im Thema Analysieren der in Rechnung gestellten Sitzungsinformationen.

  1. Wählen Sie im Navigationsmenü Themen.

  2. Wählen Sie Neues Thema aus und benennen Sie es.

  3. Fügen Sie Text im Knoten Nachricht hinzu.

  4. Wählen Sie Speichern aus, wenn Sie mit der Bearbeitung der Nachricht fertig sind.

  5. Wählen Sie Themen im Navigationsmenü aus, und wählen Sie dann die Themenzeile Gruß aus.

  6. Löschen Sie die Nachrichtenknoten im Thema Begrüßung.

  7. Damit der Bot automatisch zu einem Benutzerthema umgeleitet wird, wählen Sie Knoten hinzufügen (+) , um einen Knoten hinzuzufügen, und dann Zu einem anderen Thema wechseln aus.

  8. Wählen Sie im Flyout-Menü das Benutzerthema aus, das Sie oben erstellt haben.

  9. Wählen Sie Speichern aus, wenn Sie mit der Bearbeitung der Nachricht fertig sind.

  10. Bot veröffentlichen.

Sie können Ihren Bot jetzt testen, indem Sie auf die Webseite gehen, auf der Sie den benutzerdefinierten Canvas Ihres Bots bereitgestellt haben. Sie sehen, wie der Bot die Konversation startet, indem er automatisch das neue Thema anzeigt.