API JavaScript de Live Chat

Usa la API JavaScript de onWebChat para personalizar tu widget de chat y automatizar flujos. Puedes pasar datos del visitante, definir el idioma del widget, maximizar u ocultar el widget y más.

Por ejemplo, puedes enviar los datos del visitante al chat, definir el idioma por página o abrir el widget programáticamente cuando el usuario hace clic en un botón.

Añade tu código API justo debajo del script del widget de chat, como se muestra a la derecha.




    <script type='text/javascript'>
        /* Paste your onWebChat widget installation snippet from the dashboard here. */
    </script>
    <script type='text/javascript'>
        /* Add your JavaScript API calls below, for example onWebChat.set() or onWebChat.get() */
    </script>

Definir información del visitante

Puedes definir los datos del visitante antes o durante una sesión de chat. Por ejemplo, definir el nombre ayuda a tu equipo a identificar contactos en la lista de visitantes.

Usa estas llamadas API para definir nombre, email, teléfono y notas del visitante:



    onWebChat.set("name","Sarah Chen");
    onWebChat.set("email","sarah.chen@example.com");
    onWebChat.set("phone","+1 555 010 0142");
    onWebChat.set("notes","Returning visitor, requested an Enterprise trial");

Obtener información del visitante

Puedes leer el nombre, correo electrónico, teléfono y notas del visitante siempre que estos valores se hayan proporcionado a través de esta API de JavaScript, recopilado en el formulario pre-chat o actualizado por los agentes en el panel de control.

Llama a estas funciones cuando el widget esté completamente cargado. Ejemplo:
onWebChat.set("onWebChatLoaded", function() { console.log("visitor name: " + onWebChat.get("name")); });



    onWebChat.get("name");
    onWebChat.get("email");
    onWebChat.get("phone");
    onWebChat.get("notes");

Definir idioma del widget

Define el idioma del widget con el código de idioma para cualquier idioma activado en tu panel.

Por ejemplo, "es" para español, "en" para inglés y "fr" para francés. Si el código no está activado, el widget usa tu idioma por defecto. Puedes cambiar el idioma por defecto en Ajustes > Idiomas.

Códigos de idioma disponibles:

am ar az be bg bn bs ca cs da de dv dz el en es et fa fi fil fo fr he hi hr ht hu hy id is it ja ka kk kl km ko ky la lb lo lt lv mg mk mn ms mt my ne nl no pl ps pt ro ru rw si sk sl sm so sq sr sv sw tg th ti tk to tr uk ur uz vi zh zh-TW





    onWebChat.set("language","es");

Definir aspecto del widget

Puedes controlar las opciones principales de visualización del widget:

Usa el parámetro max con 0 para minimizar o 1 para maximizar el widget.

Para ocultar el widget, usa la función set con el parámetro show y valor 0. Usa 1 para mostrarlo de nuevo.





    onWebChat.set("max",1);

    onWebChat.set("show",0);

Definir información de página

Puedes sobrescribir la URL y el título de la página actual que se envían a onWebChat:

Usa el parámetro pageUrl para establecer una URL personalizada visible para los agentes en la consola de chat. Útil para aplicaciones de una sola página (SPA) o enrutamiento personalizado.

Usa el parámetro pageTitle para definir un título personalizado que verán los agentes en lugar del título de la página del navegador.





    onWebChat.set("pageUrl","https://onwebchat.com/newPage");

    onWebChat.set("pageTitle","New title");

Obtener estado del widget

Devuelve "online" u "offline" según la disponibilidad actual de tu chat.

Llama a esta función cuando el widget esté cargado. Ejemplo:
onWebChat.set("onWebChatLoaded", function() { console.log("chat status: " + onWebChat.get("status")); });




    onWebChat.get("status");

Obtener estado de conexión

Devuelve true si el widget de chat tiene una conexión socket activa con el servidor, o false en caso contrario. Útil para comprobar la conectividad antes de realizar acciones.




    onWebChat.get("isConnected");

Obtener estado abierto/cerrado del widget

Devuelve true si el widget de chat está actualmente maximizado (abierto), o false si está minimizado (cerrado).




    onWebChat.get("isMaximized");

Obtener ID del diálogo

Devuelve el ID del diálogo activo actual, o 0 si no hay un diálogo de chat activo. Útil para integraciones que necesitan vincular una sesión de chat a un CRM o sistema de tickets.




    onWebChat.get("dialogId");

Enviar mensaje

Puedes enviar un mensaje de chat en nombre del visitante de forma programática. Útil para crear flujos de ayuda contextuales, como enviar "Necesito ayuda con mi pedido" cuando el visitante hace clic en un botón de ayuda.

El mensaje aparecerá en el chat como si lo hubiera escrito el visitante. El widget debe estar cargado y conectado antes de enviar.




    onWebChat.set("sendMessage","I need help with my order");

Definir departamento

Puedes preseleccionar un departamento para el visitante según el contexto de la página. Por ejemplo, dirigir automáticamente a los visitantes de tu página de precios a "Ventas" y a los de tu página de ayuda a "Soporte".

Puedes pasar el nombre del departamento (string) o el ID del departamento (number). El nombre debe coincidir con uno de los departamentos configurados en tu panel.




    onWebChat.set("department","Sales");

Funciones callback

Puedes ejecutar funciones callback cuando ocurren eventos concretos del chat:

onClick se ejecuta cuando el visitante hace clic en el widget de chat

onMaximize se ejecuta cuando el widget se maximiza

onMinimize se ejecuta cuando el widget se minimiza

onTrigger se ejecuta cuando se activa un trigger

onStartWriting se ejecuta cuando el visitante empieza a escribir

onNewMessage se ejecuta cuando se envía o recibe un nuevo mensaje. El callback recibe dos argumentos: el texto del mensaje y quién lo envió ("visitor", "agent" o "bot")

onEndChat se ejecuta cuando se finaliza el chat. El callback recibe un argumento: quién lo finalizó ("visitor", "agent" o "bot")

onChatStatusChange se ejecuta cuando el estado del widget de chat cambia a en línea o fuera de línea. El callback recibe un argumento: el nuevo estado ("online" u "offline")

onWebChatLoaded se ejecuta cuando el widget de chat termina de cargar




    onWebChat.set("onClick",function(){ alert('chat widget is clicked'); });

    onWebChat.set("onMaximize",function(){ alert('chat maximized'); });

    onWebChat.set("onMinimize",function(){ alert('chat minimized'); });

    onWebChat.set("onTrigger",function(){ alert('trigger activated'); });

    onWebChat.set("onStartWriting",function(){ alert('visitor is writing'); });

    onWebChat.set("onNewMessage",function(msg, by){
        console.log('new message by ' + by + ': ' + msg);
    });

    onWebChat.set("onEndChat",function(endedBy){
        console.log('chat ended by ' + endedBy);
    });

    onWebChat.set("onChatStatusChange",function(status){
        console.log('agents are now ' + status);
    });

    onWebChat.set("onWebChatLoaded",function(){ alert('chat widget is loaded'); });

Volver al Soporte