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.

Déconnexion par programmation de la session de chat d’un widget de communication Amazon Connect

Vous pouvez déconnecter la session de chat d'un widget de communication JavaScript par programmation en utilisant « » en appelant la disconnect méthode enregistrée dans le widget. iframe Dans le document hôte du widget, vous pouvez référencer la fonction disconnect à l’aide de l’extrait de code suivant :

document.getElementById("amazon-connect-chat-widget-iframe").contentWindow.connect.ChatSession.disconnect()

Vous pouvez facilement l’ajouter au script du widget existant. Voici un exemple d’extrait :

<script type="text/javascript">
  (function(w, d, x, id){
    s=d.createElement('script');
    s.src='https://your-instance-alias.my.connect.aws/connectwidget/static/amazon-connect-chat-interface-client.js';
    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', '...');
  amazon_connect('styles', { iconType: 'CHAT', openChat: { color: '#ffffff', backgroundColor: '#123456' }, closeChat: { color: '#ffffff', backgroundColor: '#123456'} });
  amazon_connect('snippetId', '...');
  amazon_connect('supportedMessagingContentTypes', [ 'text/plain', 'text/markdown', 'application/vnd.amazonaws.connect.message.interactive', 'application/vnd.amazonaws.connect.message.interactive.response' ]);
 
  // Add disconnect event listener
  window.addEventListener("pagehide", () => {
      document.getElementById("amazon-connect-chat-widget-iframe").contentWindow.connect.ChatSession.disconnect();
  });
</script>

Implémentation et cas d’utilisation

La déconnexion d’appel par programmation peut être utile dans de nombreux cas. Elle permet de mieux contrôler le moment où il faut mettre fin à la conversation, en dehors du simple fait de cliquer manuellement sur le bouton End Chat. Voici quelques cas d’utilisation courants des appels disconnect.

À la fermeture ou à la navigation

Un cas d’utilisation courant consiste à associer la fonctionnalité de déconnexion aux événements qui se déclenchent lorsque le contexte du navigateur ou de l’onglet est détruit. pagehide et beforeunload sont les événements courants qui se déclenchent lors de la désactivation du navigateur. Ils sont déclenchés lorsqu’un utilisateur actualise, accède à une autre URL ou ferme l’onglet ou le navigateur. Bien que les deux événements soient déclenchés lorsque le contexte du navigateur est détruit, rien ne garantit que la fonctionnalité disconnect puisse être complètement exécutée avant que les ressources du navigateur ne soient nettoyées.

pagehide est un événement plus moderne du cycle de vie des pages qui est pris en charge par tous les principaux navigateurs et systèmes d’exploitation. beforeunload est un événement alternatif à essayer si l’événement pagehide ne parvient pas à appeler la déconnexion de manière cohérente. beforeunload est déclenché avant pagehide, ce qui peut apporter une fiabilité supplémentaire si la fonctionnalité disconnect ne s’exécute pas avant la fermeture du navigateur. Il y a eu des problèmes de fiabilité concernant beforeunload, en particulier sur les appareils iOS.

Voici un exemple d’extrait :

// Call disconnect when `beforeunload` triggers
window.addEventListener("beforeunload", (event) => {
    document.getElementById("amazon-connect-chat-widget-iframe").contentWindow.connect.ChatSession.disconnect();
});

// Call disconnect when `pagehide` triggers
window.addEventListener("pagehide", (event) => {
    document.getElementById("amazon-connect-chat-widget-iframe").contentWindow.connect.ChatSession.disconnect();
});

Lors du changement de contexte

Un autre cas d'utilisation serait de déclencher une déconnexion lorsque l'utilisateur change de contexte, par exemple lorsqu'un utilisateur change, minimise tab/app ou verrouille son écran. L’événement visibilitychange peut gérer de manière fiable les scénarios dans lesquels le contexte n’est plus visible.

Voici un exemple d’extrait :

window.addEventListener("visibilitychange", () => {
    if (document.visibilityState === "hidden") {
        document.getElementById("amazon-connect-chat-widget-iframe").contentWindow.connect.ChatSession.disconnect();
    } else if (document.visibilityState === "visible") {
        ...
    }
});