So richten Sie Ihr durchgängiges Self-Service-Chat-Erlebnis für Agenten ein - Amazon Connect
Was ist AI Messaging Streaming?AktivierungsstatusKommunikations-Widget erstellenTesten Sie das Streaming-Erlebnis

Die vorliegende Übersetzung wurde maschinell erstellt. Im Falle eines Konflikts oder eines Widerspruchs zwischen dieser übersetzten Fassung und der englischen Fassung (einschließlich infolge von Verzögerungen bei der Übersetzung) ist die englische Fassung maßgeblich.

So richten Sie Ihr durchgängiges Self-Service-Chat-Erlebnis für Agenten ein

Anmerkung

Orchestrierung Für KI-Agenten muss das Chat-Streaming für Chat-Kontakte aktiviert sein. Ohne aktiviertes Chat-Streaming können einige Nachrichten nicht gerendert werden. Siehe Nachrichtenstreaming für KI-gestützten Chat aktivieren.

Was ist AI Messaging Streaming?

AI Message Streaming ist eine Amazon Connect Connect-Funktion, die die progressive Anzeige von Antworten von KI-Agenten während Chat-Interaktionen ermöglicht. Anstatt darauf zu warten, dass die KI eine vollständige Antwort generiert, bevor sie dem Kunden etwas zeigt, wird beim Streaming Text angezeigt, während er generiert wird, was zu einem natürlicheren Konversationserlebnis führt.

So funktioniert’s

Bei Standard-Chat-Antworten warten die Kunden, bis die KI ihre gesamte Antwort generiert, und dann erscheint die vollständige Nachricht auf einmal. Beim KI-Nachrichtenstreaming sehen Kunden eine wachsende Textblase, in der Wörter nach und nach erscheinen, während die KI sie generiert, ähnlich wie wenn sie jemandem in Echtzeit beim Tippen zuschauen.

Anmerkung

Offizielle Dokumentation: Die vollständige technische Referenz finden Sie unterNachrichtenstreaming für KI-gestützten Chat aktivieren.

Vorteile der progressiven Textanzeige

KI-Nachrichtenstreaming bietet mehrere wichtige Vorteile für das Kundenerlebnis:

  • Verkürzte gefühlte Wartezeit — Kunden sehen sofortige Aktivitäten, anstatt auf ein Ladespinner zu starren

  • Natürlicherer Gesprächsfluss — Progressiver Text ahmt das Tippen von Menschen nach und sorgt so für eine ansprechendere Interaktion

  • Besseres Engagement — Kunden können beginnen, die Antwort zu lesen, während sie noch generiert wird

  • Erfolgsmeldungen — KI-Agenten können während der Bearbeitung Zwischennachrichten wie „Einen Moment, während ich Ihr Konto überprüfe“ bereitstellen

Standard-Chat im Vergleich zum Streaming-Chat

In der folgenden Tabelle wird das Kundenerlebnis zwischen Standard-Chat und Streaming-Chat verglichen:

Aspekt Standard-Chat Streaming-Chat
Anzeige der Antwort Die vollständige Meldung wird auf einmal angezeigt Der Text erscheint nach und nach (wachsende Blase)
Kundenerlebnis Warten Sie auf die vollständige Antwort mit Ladeanzeige Sehen Sie, wie Wörter in Echtzeit erscheinen
Empfundene Wartezeit Länger (Warten auf vollständige Antwort) Kürzer (sofortiges visuelles Feedback)
Gesprächsgefühl Transaktional Natürlich, wie mit einer Person zu chatten
Botschaften zur Erfüllung Nicht verfügbar KI kann vorläufige Status-Updates senden
Umgang mit Lex Timeout Vorbehaltlich der Lex Timeout-Limits Beseitigt Lex-Timeout-Einschränkungen

Aktivierungsstatus

Die Verfügbarkeit von AI Message Streaming hängt davon ab, wann Ihre Amazon Connect Connect-Instance erstellt wurde und wie sie konfiguriert ist.

Automatische Aktivierung für neue Instances

Amazon Connect Connect-Instances, die nach Dezember 2025 erstellt wurden, ist AI Message Streaming standardmäßig aktiviert. Das MESSAGE_STREAMING Instance-Attribut wird true für diese Instances automatisch auf gesetzt, sodass keine zusätzliche Konfiguration erforderlich ist.

Wichtig

Wenn Sie ein AWS Konto mit einer Amazon Connect Connect-Instance verwenden, die vor Dezember 2025 erstellt wurde, müssen Sie AI Message Streaming möglicherweise manuell aktivieren. Folgen Sie den Anweisungen in der Dokumentation Nachrichtenstreaming für KI-gestützten Chat aktivieren, um das MESSAGE_STREAMING Attribut Ihrer Instance zu überprüfen und es bei Bedarf zu aktivieren.

Amazon Lex Bot-Berechtigungen

AI Message Streaming erfordert die lex:RecognizeMessageAsync entsprechende Genehmigung, um korrekt zu funktionieren. Diese Berechtigung ermöglicht Amazon Connect, die asynchrone Nachrichtenerkennungs-API aufzurufen, die Streaming-Antworten ermöglicht.

Für neue Lex-Bot-Zuordnungen: Wenn Sie Ihrer Amazon Connect-Instance einen neuen Amazon Lex-Bot zuordnen, ist die erforderliche lex:RecognizeMessageAsync Berechtigung automatisch in der ressourcenbasierten Richtlinie des Bots enthalten. Es ist keine zusätzliche Konfiguration erforderlich.

Wichtig

Wenn Sie einen Amazon Lex Lex-Bot haben, der mit Ihrer Amazon Connect Connect-Instance verknüpft war, bevor AI Message Streaming aktiviert wurde, müssen Sie möglicherweise die ressourcenbasierte Richtlinie des Bots aktualisieren, um die lex:RecognizeMessageAsync Genehmigung einzubeziehen.

So aktualisieren Sie Ihre bestehende Lex-Bot-Richtlinie:

  1. Navigieren Sie zur Amazon Lex Lex-Konsole

  2. Wählen Sie Ihren Bot aus und gehen Sie zu Ressourcenbasierte Richtlinie

  3. Fügen Sie die lex:RecognizeMessageAsync Aktion zur Richtlinienerklärung hinzu, die Amazon Connect Connect-Zugriff gewährt

  4. Speichern Sie die aktualisierte Richtlinie

Eine ausführliche Anleitung finden Sie im Abschnitt Lex-Bot-Berechtigungen in der AWS Dokumentation.

Kommunikations-Widget erstellen

Das Amazon Connect Communications Widget ist eine einbettbare Chat-Oberfläche, die Sie zu jeder Website hinzufügen können. In diesem Abschnitt erstellen und konfigurieren Sie ein Widget zum Testen von AI Message Streaming. Sie können diesen Abschnitt überspringen, wenn Sie Ihr eigenes Kunden-Chat-Widget verwenden möchten.

  1. Navigieren Sie in der Amazon Connect Connect-Konsole zu Ihrer Instance

  2. Klicken Sie im linken Navigationsmenü auf Kanäle

  3. Klicken Sie auf das Kommunikations-Widget

  4. Sie sehen die Verwaltungsseite des Kommunikations-Widgets

Anmerkung

Was ist das Kommunikations-Widget? Das Communications Widget ist die out-of-the-box Chat-Lösung von Amazon Connect. Es bietet eine voll funktionsfähige Chat-Oberfläche, die Sie mithilfe eines einfachen JavaScript Snippets in Websites einbetten können. Das Widget bewältigt die gesamte Komplexität des Verbindungsaufbaus, der Sitzungsverwaltung und der Anzeige von Nachrichten.

Schritt 2: Erstellen Sie ein neues Widget

  1. Klicken Sie auf Widget hinzufügen, um ein neues Kommunikations-Widget zu erstellen

  2. Geben Sie folgende Details ein:

    • Name (Name: AI-Streaming-Demo-Widget

    • Description (Beschreibung: Widget for testing AI Message Streaming

  3. Stellen Sie sicher, dass unter Kommunikationsoptionen die Option Chat hinzufügen ausgewählt ist

  4. Wählen Sie Self Service Test Flow als Chat-Kontaktablauf

  5. Klicken Sie auf Speichern und fahren Sie fort, um zur Konfigurationsseite zu gelangen

Auswahl von Contact Flow

Stellen Sie sicher, dass Sie einen Kontaktablauf auswählen, der:

  • Hat die Grundeinstellungen konfiguriert (erstellt eine KI-Sitzung, Protokollierung usw.)

  • Routen zu Ihrem Lex-Bot mit AI Agent-Integration

  • Verfügt über eine korrekte Fehlerbehandlung bei Verbindungsabbrüchen

Wenn Sie noch keinen Kontakt-Flow erstellt haben, schließen Sie zuerst den Abschnitt Flow erstellen ab.

Schritt 3: Passen Sie das Aussehen des Widgets an

Passen Sie das Erscheinungsbild Ihres Chat-Widgets an Ihre Marke an und wählen Sie Speichern und fortfahren aus.

Schritt 4: Zulässige Domains konfigurieren

Das Kommunikations-Widget wird nur auf Websites geladen, die ausdrücklich zugelassen sind. Diese Sicherheitsfunktion verhindert die unbefugte Verwendung Ihres Widgets.

  1. Scrollen Sie nach unten zu Zulässige Domains

  2. Klicken Sie auf Domain hinzufügen und fügen Sie die folgende Domain für Localhost-Tests hinzu:

    • http://localhost

  3. Wählen Sie unter Sicherheit die Option Nein aus

  4. Wenn Sie die Bereitstellung später auf einer Produktionswebsite planen, fügen Sie auch diese Domains hinzu und stellen Sie sicher, dass Sie die Sicherheit konfigurieren (z. B.https://www.example.com)

Schritt 5: Widget-Code speichern und abrufen

  1. Klicken Sie auf Speichern und fahren Sie fort, um Ihre Widget-Konfiguration zu speichern

  2. Nach der Erstellung wird die Seite mit den Widget-Details und Ihrem Einbettungscode angezeigt

  3. Wichtig: Kopiere und speichere die folgenden Werte aus dem Einbettungscode-Snippet:

    • Client-URI — Die URL zur Widget-Datei JavaScript

    • Widget-ID — Eine eindeutige Kennung für Ihr Widget

    • Snippet-ID — Eine Base64-kodierte Konfigurationszeichenfolge

Schritt 6: Richten Sie die lokale Testumgebung ein

Um das Widget lokal zu testen, erstellen Sie eine einfache HTML-Datei, die das Kommunikations-Widget lädt.

  1. Erstellen Sie zum Testen einen neuen Ordner auf Ihrem Computer (z. B.ai-streaming-test)

  2. Laden Sie das Hintergrundbild für die Demoseite herunter und speichern Sie es wie background.jpg in Ihrem Testordner

  3. Erstellen Sie eine neue Datei namens index.html in Ihrem Testordner mit dem folgenden Inhalt:

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <style>
        body {
            background-image: url("background.jpg");
            background-repeat: no-repeat;
            background-size: cover;
        }
    </style>
    <title>AI Message Streaming Demo</title>
</head>
<body>
    <div id="root"></div>
    <script type="text/javascript">
      (function(w, d, x, id){
        s=d.createElement('script');
        s.src='REPLACE_WITH_CLIENT_URI';
        s.async=1;
        s.id=id;
        d.getElementsByTagName('head')[0].appendChild(s);
        w[x] = w[x] || function() { (w[x].ac = w[x].ac || []).push(arguments) };
      })(window, document, 'amazon_connect', 'REPLACE_WITH_WIDGET_ID');
      amazon_connect('styles', {
        iconType: 'CHAT',
        openChat: { color: '#ffffff', backgroundColor: '#ff9200' },
        closeChat: { color: '#ffffff', backgroundColor: '#ff9200'}
      });
      amazon_connect('snippetId', 'REPLACE_WITH_SNIPPET_ID');
      amazon_connect('supportedMessagingContentTypes', [
        'text/plain',
        'text/markdown',
        'application/vnd.amazonaws.connect.message.interactive',
        'application/vnd.amazonaws.connect.message.interactive.response'
      ]);
      amazon_connect('customStyles', {
        global: { frameWidth: '500px', frameHeight: '900px'}
      });
    </script>
</body>
</html>

Schritt 7: Platzhalterwerte ersetzen

Ersetzen Sie die Platzhalterwerte in der HTML-Datei durch Ihre tatsächlichen Widget-Werte:

Placeholder Ersetze durch Beispiel
REPLACE_WITH_CLIENT_URI Ihre Client-URI aus Schritt 5 https://d2s9x5slqf05.cloudfront.net/amazon-connect-chat-interface-client.js
REPLACE_WITH_WIDGET_ID Ihre Widget-ID aus Schritt 5 amazon_connect_widget_abc123
REPLACE_WITH_SNIPPET_ID Deine Snippet-ID aus Schritt 5 QVFJREFIaWJYbG...(lange Base64-Zeichenfolge)

Schritt 8: Starten Sie einen lokalen Webserver

Um das Widget zu testen, müssen Sie die HTML-Datei von einem lokalen Webserver aus bereitstellen. Hier sind mehrere Optionen:

Option A: Python (falls installiert)

python -m http.server 8001
Option B: Node.js (falls installiert)

npx http-server -p 8001
Option C: VS Code Live-Servererweiterung

  • Installieren Sie die Erweiterung „Live Server“ in VS Code

  • Klicken Sie mit der rechten Maustaste auf index.html und wählen Sie „Mit Live Server öffnen“

Nachdem Sie den Server gestartet haben, öffnen Sie Ihren Browser und navigieren Sie zu: http://localhost:8001

Sie sollten die Demo-Seite mit einer orangefarbenen Chat-Schaltfläche in der unteren rechten Ecke sehen.

Testen Sie das Streaming-Erlebnis

Jetzt, da Ihr Widget geladen ist, ist es an der Zeit, AI Message Streaming zu testen und die progressive Textanzeige in Aktion zu beobachten.

Worauf Sie achten sollten: Streaming im Vergleich zu Non-Streaming

Wenn Sie den Unterschied zwischen Streaming-Antworten und Nicht-Streaming-Antworten verstehen, können Sie überprüfen, ob AI Message Streaming funktioniert:

Behavior Kein Streaming (Standard) Streaming (KI-Nachrichtenstreaming)
Erste Anzeige Anzeige wird geladen oder Punkte eingegeben Der Text erscheint sofort
Aussehen des Textes Die vollständige Nachricht wird auf einmal angezeigt Wörter erscheinen nach und nach (wachsende Blase)
Zeitpunkt der Reaktion Warten Sie, bis die KI die Generierung abgeschlossen hat Sehen Sie sich die Antwort an, während sie generiert wird
Visueller Effekt „Pop“ des kompletten Textes Reibungsloser, fließender Text, als würde man jemandem beim Tippen zuschauen