Las traducciones son generadas a través de traducción automática. En caso de conflicto entre la traducción y la version original de inglés, prevalecerá la version en inglés.

Desconecta mediante programación la sesión de chat de un widget de comunicación de Connect Customer

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 host del widget, puede hacer referencia a la función disconnect con el siguiente fragmento de código:

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

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

<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>

Casos de uso e implementación

Llamar a disconnect mediante programación puede resultar útil en varios casos. Proporciona más control sobre cuándo terminar la conversación (aparte de haciendo clic manualmente en el botón End Chat). A continuación, se indican algunos casos de uso frecuentes de la llamada a disconnect.

Al cerrar o durante la navegación

Un caso de uso común sería adjuntar la funcionalidad disconnect a los eventos que se activan cuando se destruye el contexto del navegador o la pestaña. pagehide y beforeunload son los eventos más comunes que se activan en esos casos. Se activan cuando un usuario actualiza la página, 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 función disconnect pueda ejecutarse por completo antes de que se limpien los recursos del navegador.

pagehidees un evento del ciclo de vida de una página más moderno y es compatible con todos los principales navegadores y sistemas operativos. beforeunloades un evento alternativo para probar si el pagehide evento no logra llamar a Disconnect de manera consistente. beforeunloadse activa antespagehide, lo que puede proporcionar una fiabilidad adicional si la disconnect función no se completa antes de cerrar el navegador. Ha habido problemas de fiabilidad con 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();
});

En el momento de cambiar de contexto

Otro caso práctico sería provocar una desconexión cuando el usuario cambia de contexto (por ejemplo, cuando un usuario cambia, minimiza tab/app o bloquea su pantalla). El evento visibilitychange 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") {
        ...
    }
});