Les traductions sont fournies par des outils de traduction automatique. En cas de conflit entre le contenu d'une traduction et celui de la version originale en anglais, la version anglaise prévaudra.

Ajout du widget Amazon Connect à votre site Web pour accepter les contacts via le chat, les tâches, les e-mails et les appels Web

Les rubriques de cette section expliquent comment créer et personnaliser un widget de communication pour votre site Web. Vous allez créer un formulaire de contact qui détermine le comportement des contacts créés via votre widget, puis en personnaliser l’apparence et les fonctionnalités.

Étape 1 : créer un formulaire de contact pour votre widget

Au cours de cette étape, vous créez et personnalisez une vue qui détermine le comportement des contacts créés via votre widget.

Étape 2 : personnaliser votre widget de communication

Au cours de cette étape, vous personnalisez l’expérience du widget de communication pour vos clients.

Sur la page Créer un widget de communication, choisissez les styles des boutons du widget, puis les noms d’affichage et les styles. À mesure que vous choisissez ces options, l’aperçu du widget est automatiquement mis à jour afin que vous puissiez voir à quoi ressemblera l’expérience pour vos clients.

Type d’affichage

Vous pouvez choisir entre deux types d’affichage pour les widgets du formulaire de contact :

Styles de boutons

En-tête du widget

La bannière doit être au format .svg, .jpg ou .png. L'image peut mesurer 280 pixels (largeur) par 60 pixels (hauteur). Toute image supérieure à ces dimensions sera redimensionnée pour s'adapter à l'espace des composants de logo de 280 x 60.

Étape 3 : spécifier les domaines du site Web où vous souhaitez afficher le widget de communication

Étape 4 : confirmer et copier le code et les clés de sécurité du widget de communication

Au cours de cette étape, vous confirmez vos sélections, copiez le code du widget de communication et l’incorporez dans votre site Web. Si vous avez choisi d'utiliser des JWT à l'étape 3, vous pouvez également copier les clés secrètes pour les créer.

Clé de sécurité

Utilisez cette clé de sécurité de 44 caractères pour générer des jetons Web JSON à partir de votre serveur Web. Vous pouvez également mettre à jour ou faire pivoter les clés si vous devez les modifier. Dans ce cas, Amazon Connect vous fournit une nouvelle clé et conserve la clé précédente jusqu'à ce que vous ayez l'occasion de la remplacer. Une fois la nouvelle clé déployée, vous pouvez revenir dans Amazon Connect et supprimer la clé précédente.

Lorsque vos clients interagissent avec le widget de communication sur votre site Web, le widget demande un jeton JWT à votre serveur Web. Lorsque ce jeton JWT est fourni, le widget l’inclut dans la demande de contant du client final à Amazon Connect. Amazon Connect utilise ensuite la clé secrète pour déchiffrer le jeton. En cas de succès, cela confirme que le jeton JWT a été émis par votre serveur Web, et Amazon Connect achemine la demande de contact vers les agents de votre centre de contact.

Spécificités du jeton Web JSON

L'extrait de code suivant illustre comment générer un JWT en 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

Script de widget de communication

L’image suivante montre un exemple du code JavaScript que vous incorporez dans les sites Web où vous souhaitez que les clients interagissent avec votre centre de contact. Ce script affiche le widget dans le coin inférieur droit de votre site Web.

Lorsque votre site Web se charge, les clients voient d’abord l’icône du widget. Lorsqu’ils choisissent cette icône, le widget de communication s’ouvre et les clients peuvent initier un contact avec vos agents.

Pour apporter des modifications au widget de communication à tout moment, choisissez Modifier.

Pour modifier les icônes de widget sur le site Web, vous recevez un nouvel extrait de code afin de mettre à jour directement votre site Web.