Clash Master: Un panel moderno para la gestión del tráfico OpenClash.

February 09, 2026

Categoría: Proyectos Prácticos de Código Abierto

Etiquetas:

Docker Clash OpenClash Traffic Monitoring Dashboard

Clash Master: Un panel moderno para la gestión del tráfico OpenClash

OpenClash es una solución popular de proxy/routers para gestionar el tráfico de VPN y bloqueo de anuncios en routers. Si bien sus APIs backend proporcionan datos sin procesar, carecen de una interfaz visual intuitiva.

Con Clash Master – un panel moderno de código abierto construido con Next.js, React 19, TypeScript, Tailwind CSS y un colector de datos Node.js. Te ofrece:

Gráficos de tráfico en tiempo real (ancho de banda, latencia, regiones)
Estadísticas de reglas interactivas y paginación
Visión de dispositivos, IP y dominios
Actualizaciones en tiempo real impulsadas por WebSocket
Despliegue fácil con Docker
Imágenes multi‑arquitectura (amd64 y arm64)
Persistencia de datos sencilla mediante SQLite

Por qué usar Clash Master?

Función	Beneficio
UI Web + API	El front‑end puede acceder a los datos a través del mismo dominio sin necesidad de puertos adicionales
WebSocket	Actualizaciones instantáneas de los paneles sin polling
Docker Compose	Despliegue configuración cero, conconectar y listo
Colector de datos	Se ejecuta como un micro‑servicio separado, manteniendo la UI ligera
Scripts CLI	`setup.sh` detecta automáticamente conflictos de puertos y genera el `docker-compose.yml` necesario

Inicio rápido con Docker Compose (recomendado)

Crea un archivo docker-compose.yml con lo siguiente

services:
  clash-master:
    image: foru17/clash-master:latest
    container_name: clash-master
    restart: unless-stopped
    ports:
      - \"3000:3000\"  # Web UI
      - \"3001:3001\"  # API (opcional)
      - \"3002:3002\"  # WebSocket (opcional)
    volumes:
      - ./data:/app/data
    environment:
      - NODE_ENV=production

Ejecuta
```
docker compose up -d
```
Abre http://localhost:3000 en un navegador.
La primera visita te pedirá que añadas un backend OpenClash (IP, puerto, token opcional). Tras guardarlo, el colector empezará a recopilar datos.

Script de un clic

Para quienes prefieren un solo comando:

curl -fsSL https://raw.githubusercontent.com/foru17/clash-master/main/setup.sh | bash

El script: 1. Descarga un docker‑compose.yml listo. 2. Comprueba si los puertos predeterminados 3000/3001/3002 están en conflicto. 3. Sugiere puertos alternativos si es necesario. 4. Crea un archivo de configuración y inicia el contenedor.

Ejecución desde el código fuente (desarrollo)

git clone https://github.com/foru17/clash-master.git
cd clash-master
pnpm install
pnpm dev

Visita http://localhost:3000 – el servidor de desarrollo observará los cambios.

Resolución de conflictos de puertos

Si encuentras errores de puerto ya en uso: 1. Crea un archivo .env:

WEB_EXTERNAL_PORT=8080
API_EXTERNAL_PORT=8081
WS_EXTERNAL_PORT=8082

2. Reinicia la pila:

docker compose down
docker compose up -d

3. Navega a http://localhost:8080.

Alternativa: Editar `docker-compose.yml`

ports:
  - \"8080:3000\"
  - \"8081:3001\"
  - \"8082:3002\"

Persistencia y respaldo de datos

El colector guarda estadísticas en ./data/stats.db. Para respaldar:

cp -r ./data ./data-backup-$(date +%Y%m%d)

Para borrar el historial, usa la pestaña “Database” de la UI para eliminar entradas más antiguas que la edad elegida.

Preguntas frecuentes destacadas

¿Conflicto de puertos? Ajusta .env o docker‑compose.yml.
Acceso a la API? Expón el puerto 3001 o configura API_URL.
WebSocket? Expón el puerto 3002 o configura WS_URL.
Conectividad al OpenClash? Asegúrate de que el External Control del router esté habilitado y que el token (si se usa) coincida.

Conclusión

Clash Master convierte métricas brutas de OpenClash en un panel interactivo y amigable para desarrolladores. Ya sea que seas administrador de red o aficionado, la combinación de herramientas modernas, despliegue Docker‑friendly y colección robusta de datos lo convierte en la solución preferida para visualizar tráfico VPN en cualquier plataforma.

Consejo: Estrellas para el proyecto en GitHub – es gratuito y ayuda a mantener el desarrollo activo.

Artículo original: Ver original

Compartir este artículo