Saltar al contenido principal

Tiempo Real y Difusión

Configuración → Avanzado → Tiempo Real configura la capa de difusión WebSocket que impulsa las actualizaciones en vivo en el panel de administración de LeadHub.

Cuando el tiempo real está habilitado:

  • El widget de Feed de Clientes en Vivo en el panel se actualiza instantáneamente cuando llega un nuevo cliente
  • Las insignias de notificación aparecen sin recargar la página
  • El tablero Kanban refleja los cambios de arrastrar y soltar de otros miembros del equipo en tiempo real

Cuando el tiempo real está deshabilitado, el panel vuelve al sondeo (la página se actualiza cada 30 segundos).

Controladores Compatibles​

Controlador¿Alojado?CostoNotas
Pusher✅ NubeNivel gratuito disponibleEl más popular, configuración más sencilla
Laravel Reverb❌ Auto-alojadoGratuito (solo costo del servidor)Servidor WebSocket oficial de Laravel
Soketi❌ Auto-alojadoGratuito (solo costo del servidor)Servidor ligero compatible con Pusher
Deshabilitado (sondeo)—GratuitoSin WebSockets; el panel hace sondeo

Hosting compartido: Pusher es la opción más fácil. Reverb/Soketi auto-alojados requieren un VPS con procesos persistentes.

Opción A — Pusher (Alojado)​

Paso 1 — Crear una App de Pusher​

  1. Regístrate en pusher.com (nivel gratuito: 200 conexiones, 200k mensajes/día).
  2. Ve a Channels → Crear App.
  3. Dale un nombre (p. ej., LeadHub) y selecciona tu región.
  4. En Claves de la App, copia:
    • App ID
    • Key
    • Secret
    • Cluster (p. ej., us2, eu)

Paso 2 — Configurar en LeadHub​

  1. Ve a Configuración → Avanzado → Tiempo Real.
  2. Establece el Controlador en Pusher / Soketi / Reverb (Protocolo Pusher).
  3. Completa los campos (App ID, App Key, App Secret, Cluster, Puerto 443, Esquema HTTPS).
  4. Haz clic en Guardar Configuración.

Opción B — Laravel Reverb (Auto-alojado)​

Reverb es un servidor WebSocket oficial de Laravel que usa el protocolo Pusher.

Paso 1 — Instalar Reverb​

En tu servidor:

php artisan reverb:install

Inicia Reverb con Supervisor:

[program:reverb]
command=php /var/www/leadhub/artisan reverb:start --host=0.0.0.0 --port=8080
autostart=true
autorestart=true
user=www-data

Paso 2 — Configurar en LeadHub​

Completa App ID, App Key, App Secret (cualquier cadena que coincida con la config de Reverb), Host Personalizado, Puerto 8080 y Esquema apropiado.

Opción C — Soketi (Auto-alojado, Ligero)​

Soketi es un servidor Node.js ligero compatible con Pusher.

npm install -g @soketi/soketi
soketi start --config.port=6001 --config.appManager.driver=array \
  --config.appManager.array.apps.0.id=leadhub \
  --config.appManager.array.apps.0.key=leadhub-key \
  --config.appManager.array.apps.0.secret=leadhub-secret

Configura en LeadHub con App ID leadhub, App Key leadhub-key, App Secret leadhub-secret, Host Personalizado, Puerto 6001.

Opción D — Deshabilitar Tiempo Real (Sondeo)​

  1. Ve a Configuración → Avanzado → Tiempo Real.
  2. Desactiva Habilitar Actualizaciones en Tiempo Real, o establece el Controlador en Deshabilitado (solo sondeo).
  3. Haz clic en Guardar Configuración.

El panel se actualiza cada 30 segundos. Todas las funciones funcionan correctamente — solo sin actualizaciones en vivo instantáneas.

Solución de Problemas​

ProblemaSolución
El feed de clientes en vivo no se actualizaVerifica que App Key/Secret coincida con tu config de Pusher/Reverb/Soketi
Errores de conexión WebSocket en la consola del navegadorVerifica los ajustes de Host Personalizado, Puerto y Esquema
Reverb/Soketi no conectaAsegúrate de que el proceso esté en ejecución y el puerto sea accesible (reglas de firewall)
"Reinicia el trabajador de cola después de cambiar el controlador"Si cambias el controlador de difusión, reinicia tu proceso del trabajador de cola

Después de cambiar la configuración de tiempo real, se necesita una actualización forzada del navegador (Ctrl+Shift+R) para que los nuevos ajustes surtan efecto en el frontend.