Desconectar mediante programación la sesión de chat de un widget de comunicación de Amazon Connect

PDFRSS

Puedes desconectar la sesión de chat de un widget de comunicación mediante programación usando 'JavaScript llamando al disconnect método almacenado en el widget. iframe Desde el documento anfitrión del widget, puedes hacer referencia a la disconnect función mediante el siguiente fragmento de código:

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

Puedes añadirlo fácilmente al script del widget existente. A continuación se muestra un ejemplo de fragmento de código:

<script type="text/javascript">
  (function(w, d, x, id){
    s=d.createElement('script');
    s.src='https://....cloudfront.net/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>

Casos de uso e implementación

Llamar a disconnect mediante programación puede resultar útil en varios casos. Proporciona un mayor control sobre cuándo terminar la conversación, aparte de hacer clic manualmente en el End Chat botón. Estos son algunos casos de uso comunes sobre cuándo llamardisconnect.

Al cerrar o navegar

Un caso de uso común sería adjuntar la funcionalidad de desconexión a los eventos que se activan cuando se destruye el contexto del navegador o la pestaña. pagehidey beforeunload son los eventos más comunes que se activan cuando se desactiva el navegador. Se activan cuando un usuario actualiza, navega a una URL diferente o cierra la pestaña o el navegador. Aunque ambos eventos se activan cuando se destruye el contexto del navegador, no hay garantía de que la disconnect función pueda ejecutarse por completo antes de que se agoten los recursos del navegador.

pagehidees un evento del ciclo de vida de una página más moderno y es compatible con los principales navegadores y sistemas operativos. beforeunloades un evento alternativo que se puede probar si el pagehide evento no logra llamar a connect de manera consistente. beforeunloadse activa antes de pagehide que se active, lo que puede proporcionar una fiabilidad adicional si la disconnect función no se completa antes de cerrar el navegador. Ha habido problemas de confiabilidad, beforeunload especialmente en los dispositivos iOS.

A continuación se muestra un fragmento de código de ejemplo:

// 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();
});

Sobre el cambio de contexto

Otro caso de uso sería activar una desconexión cuando el usuario cambia de contexto, por ejemplo, cuando un usuario cambia o minimiza la pestaña/aplicación o bloquea la pantalla. El visibilitychange evento puede gestionar de forma fiable estos escenarios en los que el contexto ya no está visible.

A continuación se muestra un fragmento de código de ejemplo:

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