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.

Hinzufügen des Amazon-Connect-Widgets zu Ihrer Website, um Chat-, Aufgaben-, E-Mail- und Webanrufkontakte anzunehmen

Die Themen in diesem Abschnitt beschreiben, wie Sie ein Kommunikations-Widget für Ihre Website erstellen und anpassen. Sie erstellen ein Kontaktformular, das das Verhalten für Kontakte bestimmt, die über Ihr Widget erstellt wurden, und passen dann das Erscheinungsbild und die Funktionalität des Widgets an.

Schritt 1: Erstellen eines Kontaktformulars für Ihr Widget

In diesem Schritt erstellen und passen Sie eine Ansicht an, die das Verhalten für Kontakte bestimmt, die über Ihr Widget erstellt wurden.

Schritt 2: Anpassen Ihres Kommunikations-Widgets

In diesem Schritt passen Sie die Umgebung des Kommunikations-Widgets für Ihre Kunden an.

Wählen Sie auf der Seite Kommunikations-Widget erstellen die Stile für die Widget-Schaltflächen sowie die Anzeigenamen und -stile aus. Bei der Auswahl dieser Optionen wird die Widget-Vorschau automatisch aktualisiert. Sie können also sehen, wie die Umgebung für die Kunden aussehen wird.

Anzeigetyp

Sie können zwischen zwei Anzeigetypen für Kontaktformular-Widgets wählen:

Schaltflächenstile

Widget-Header

Das Banner muss im .svg-, .jpg- oder .png-Format vorliegen. Das Bild kann 280 Pixel (Breite) mal 60 Pixel (Höhe) groß sein. Jedes Bild, das größer als diese Abmessungen ist, wird so skaliert, dass es in den Komponentenbereich des Logos von 280×60 passt.

Schritt 3: Angeben der Website-Domains an, auf denen das Kommunikations-Widget angezeigt werden soll

Schritt 4: Bestätigen und Kopieren des Kommunikations-Widget-Codes und der Sicherheitsschlüssel

In diesem Schritt bestätigen Sie Ihre Auswahl, kopieren den Code für das Kommunikations-Widget und betten ihn in Ihre Website ein. Wenn Sie sich in Schritt 3 für die Verwendung von JWTs entschieden haben, können Sie auch die geheimen Schlüssel für deren Erstellung kopieren.

Sicherheitsschlüssel

Verwenden Sie diesen 44-stelligen Sicherheitsschlüssel, um JSON-Webtoken von Ihrem Webserver aus zu generieren. Sie können Schlüssel auch aktualisieren oder rotieren, wenn Sie sie ändern müssen. Wenn Sie dies tun, stellt Ihnen Amazon Connect einen neuen Schlüssel zur Verfügung und behält den vorherigen Schlüssel bei, bis Sie ihn ersetzen können. Nachdem Sie den neuen Schlüssel bereitgestellt haben, können Sie zu Amazon Connect zurückkehren und den vorherigen Schlüssel löschen.

Wenn Kunden mit dem Kommunikations-Widget auf Ihrer Website interagieren, fordert das Widget von Ihrem Webserver ein JWT an. Wenn dieses JWT bereitgestellt wird, nimmt das Widget es als Teil der Kontaktanfrage des Endkunden an Amazon Connect auf. Amazon Connect verwendet dann den geheimen Schlüssel, um das Token zu entschlüsseln. Bei Erfolg wird bestätigt, dass das JWT von Ihrem Webserver ausgestellt wurde, und Amazon Connect leitet die Kontaktanfrage an Ihre Kundendienstmitarbeiter im Contact Center weiter.

Einzelheiten zum JSON-Web-Token

Der folgende Codeblock zeigt ein Beispiel für die Generierung eines JWT in Python:

import jwt 
import datetime 
CONNECT_SECRET = "your-securely-stored-jwt-secret" 
WIDGET_ID = "widget-id" 
JWT_EXP_DELTA_SECONDS = 500

payload = { 
'sub': WIDGET_ID, 
'iat': datetime.datetime.utcnow(), 
'exp': datetime.datetime.utcnow() + datetime.timedelta(seconds=JWT_EXP_DELTA_SECONDS), 
'customerId': "your-customer-id",
'relatedContactId':'your-relatedContactId',                    
'segmentAttributes': {"connect:Subtype": {"ValueString" : "connect:Guide"}}, 'attributes': {"name": "Jane", "memberID": "123456789", "email": "Jane@example.com", "isPremiumUser": "true", "age": "45"} } 
header = { 'typ': "JWT", 'alg': 'HS256' } 
encoded_token = jwt.encode((payload), CONNECT_SECRET, algorithm="HS256", headers=header) // CONNECT_SECRET is the security key provided by Amazon Connect

Skript für das Kommunikations-Widget

Die folgende Abbildung zeigt ein Beispiel für das JavaScript, das Sie auf Websites einbetten, auf denen Kunden mit Ihrem Contact Center interagieren sollen. Dieses Skript zeigt das Widget in der unteren rechten Ecke Ihrer Website an.

Wenn Ihre Website geladen wird, sehen Kunden zuerst das Widget-Symbol. Wenn sie dieses Symbol auswählen, wird das Kommunikations-Widget geöffnet und die Kunden können einen Kontakt mit Ihren Kundendienstmitarbeitern initiieren.

Sie können jederzeit Änderungen am Kommunikations-Widget über Bearbeiten vornehmen.

Damit Änderungen an Widget-Symbolen auf der Website wirksam werden, müssen Sie Ihre Website direkt mit einem neuen Codeblock aktualisieren.