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.

# Desconexión mediante programación de la sesión de chat de un widget de comunicación de Amazon Connect
<a name="programmatic-chat-disconnect"></a>

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
<a name="implementation-chat-disconnect"></a>

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
<a name="close-chat-disconnect"></a>

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.

`pagehide` es un evento de ciclo de vida de página más moderno y es compatible con los principales navegadores y sistemas operativos. `beforeunload` es un evento alternativo que se puede probar si el evento `pagehide` no logra llamar a disconnect de forma fiable. `beforeunload` se activa antes de `pagehide`, lo que puede proporcionar una fiabilidad adicional si la función `disconnect` no se completa antes del cierre del 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
<a name="context-chat-disconnect"></a>

Otro caso de uso sería activar 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") {
        ...
    }
});
```