Widget de chat web

​

Qué es

• Anónimo — no requiere nada de tu backend. El widget genera un identificador de visitante propio (guardado en localStorage del navegador) para reconocerlo entre mensajes.
• Identificado — si el visitante ya está logueado en tu sitio, tu backend puede firmarle la identidad (userId) para que MINDO la reconozca. Esto une, bajo un mismo contacto, todos los chats que ese usuario abra desde distintos dispositivos.

​

Antes de empezar

• Acceso a Configuración → Canales en MINDO con rol de administrador.
• Acceso al código de tu sitio (para pegar un <script>).
• Si vas a identificar usuarios logueados: acceso al backend de tu sitio, para calcular una firma HMAC (no se calcula nunca en el navegador).

​

Paso a paso

1

Crear el canal Web

Desde MINDO, andá a Configuración → Canales y buscá la sección Widget de chat web. Hacé clic en + Agregar canal Web.

Completá:

• Nombre de la sesión — un nombre interno para identificar este canal (por ejemplo, “Chat de la tienda”). No es lo que ve el visitante.
• Color primario — el color del header y de las burbujas del visitante.
• Mensaje de bienvenida — el primer mensaje que ve el visitante si todavía no escribió nada.
• Agente (opcional) — si querés que un agente de IA responda automáticamente en este canal.

Estado actual (verificado en QA): el color primario, el mensaje de bienvenida y el agente asignado no se están guardando al crear/editar el canal desde este formulario — el widget muestra el estilo por defecto hasta que se corrija. El snippet y el flujo de mensajería (anónimo, identificado, respuesta en tiempo real) sí funcionan con normalidad. Si la personalización es crítica para vos, contactá a soporte antes de lanzar.

2

Copiar el snippet

Al crear el canal, MINDO te muestra el snippet listo para copiar:

<script
  src="https://app.mindosoftware.com/widget.js"
  data-mindo-token="TU_TOKEN_DE_CANAL"
  async
></script>

También vas a ver un Secret HMAC — lo necesitás únicamente si vas a identificar visitantes logueados (Paso 4). Guardalo en un lugar seguro; nunca debe quedar expuesto en el HTML de tu sitio.

3

Pegar el snippet en tu sitio

Pegá el <script> antes del cierre de </body> en las páginas donde querés que aparezca el chat. No hace falta ningún build step ni dependencia — es un script vanilla, autocontenido.Al cargar la página vas a ver una burbuja de chat abajo a la derecha. Al hacer clic, se abre un panel con el chat (es un <iframe> a MINDO, así que tu sitio no necesita implementar ninguna UI de chat).

Si no aparece la burbuja, revisá la consola del navegador: el error más común es un data-mindo-token vacío o incorrecto.

4

(Opcional) Identificar visitantes logueados

Si tu sitio tiene usuarios logueados y querés que MINDO los reconozca (en vez de tratarlos como anónimos), tu backend debe agregar tres atributos más al <script>, calculados en el momento de renderizar la página (nunca hardcodeados ni calculados en el navegador):

Atributo	Qué es
data-mindo-user	El identificador único de tu usuario (userId) — el que uses vos internamente.
data-mindo-expires	Timestamp Unix (segundos) hasta cuándo es válida la firma. Recomendado: ahora + 24-72hs.
data-mindo-signature	HMAC_SHA256(secret, "{userId}:{expires}") en hexadecimal, calculado con el Secret HMAC del canal.

Node.js

Python

const crypto = require("crypto");

function firmarVisitante(userId, secretDelCanal, ttlSegundos = 60 * 60 * 24) {
  const expires = Math.floor(Date.now() / 1000) + ttlSegundos;
  const signature = crypto
    .createHmac("sha256", secretDelCanal)
    .update(`${userId}:${expires}`)
    .digest("hex");
  return { userId, expires, signature };
}

import hmac
import hashlib
import time

def firmar_visitante(user_id, secret_del_canal, ttl_segundos=60 * 60 * 24):
    expires = int(time.time()) + ttl_segundos
    mensaje = f"{user_id}:{expires}".encode("utf-8")
    signature = hmac.new(
        secret_del_canal.encode("utf-8"), mensaje, hashlib.sha256
    ).hexdigest()
    return {"userId": user_id, "expires": expires, "signature": signature}

Renderizá el resultado en el <script> (por ejemplo, desde una plantilla del lado del servidor):

<script
  src="https://app.mindosoftware.com/widget.js"
  data-mindo-token="TU_TOKEN_DE_CANAL"
  data-mindo-user="{{ userId }}"
  data-mindo-signature="{{ signature }}"
  data-mindo-expires="{{ expires }}"
  async
></script>

El Secret HMAC es un secreto de servidor. Nunca lo incluyas en HTML, JavaScript del cliente, ni en un repositorio público — solo debe existir en tu backend, del mismo modo que guardarías cualquier otra API key.

La firma es opcional por diseño: si falta, está vencida o es inválida, el visitante simplemente queda anónimo — el chat nunca se bloquea por un error de firma.

​

¿Qué pasa después?

• Cada mensaje que un visitante te escribe crea (o continúa) un chat en tu Inbox de MINDO, con Canal: Web.
• Si identificaste al visitante (Paso 4) y esa misma persona te escribe desde otro dispositivo con el mismo userId, MINDO intenta unificar el historial bajo un solo contacto.
• Si tenés un agente de IA asignado al canal, puede responder automáticamente; si no, el chat espera respuesta humana como cualquier otro canal.

​

Preguntas frecuentes