snatchgame/deploy/NGINX-CONFIG.md

Configuración de Nginx para SnatchGame

Este documento explica cómo configurar Nginx Proxy Manager para que el juego SnatchGame funcione correctamente con todos sus componentes.

Arquitectura del Sistema

El juego está dockerizado en un solo contenedor que ejecuta dos servicios:

• Frontend (Vue.js): Puerto 3000 interno
• Backend (Colyseus): Puerto 2567 interno

El contenedor está conectado a la red principal de Docker sin exponer puertos al host.

Configuración en Nginx Proxy Manager

1. Proxy Host Principal

Configuración básica:

• Domain Names: snatchgame.nucleoriofrio.com
• Forward Hostname/IP: snatchgame
• Forward Port: 3000
• Cache Assets: ON
• Block Common Exploits: ON
• Websockets Support: ON

2. Custom Locations (Advanced Tab)

Location: /api

• Forward to: http://snatchgame:2567/api
• Websockets Support: OFF

Location: /ws

• Forward to: http://snatchgame:2567
• Websockets Support: ON

Location: /colyseus (Opcional - Monitor)

• Forward to: http://snatchgame:2567/colyseus
• Websockets Support: OFF

3. Custom Nginx Configuration

Para que el dashboard SSE funcione correctamente, agregar en Advanced → Custom Nginx Configuration:

location /api/dashboard-stream {
    proxy_pass http://snatchgame:2567/api/dashboard-stream;
    proxy_set_header Host $http_host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto $scheme;

    # Headers específicos para SSE
    proxy_buffering off;
    proxy_cache off;
    proxy_read_timeout 24h;
    proxy_http_version 1.1;
}

4. SSL Configuration

• SSL Certificate: Request new Let's Encrypt
• Force SSL: ON
• HTTP/2 Support: ON

Rutas Resultantes

Una vez configurado, las siguientes rutas estarán disponibles:

Ruta	Destino	Propósito
https://snatchgame.nucleoriofrio.com/	snatchgame:3000	Frontend principal (Vue.js)
https://snatchgame.nucleoriofrio.com/api/*	snatchgame:2567/api/*	API REST del backend
https://snatchgame.nucleoriofrio.com/ws	snatchgame:2567	WebSocket de Colyseus
https://snatchgame.nucleoriofrio.com/api/dashboard-stream	snatchgame:2567/api/dashboard-stream	Server-Sent Events para dashboard
https://snatchgame.nucleoriofrio.com/colyseus	snatchgame:2567/colyseus	Monitor de Colyseus

Configuración del Cliente

El cliente (frontend) está configurado para usar estas rutas automáticamente:

• WebSocket: wss://snatchgame.nucleoriofrio.com/ws
• API: https://snatchgame.nucleoriofrio.com/api
• SSE Dashboard: https://snatchgame.nucleoriofrio.com/api/dashboard-stream

Problemas Comunes y Soluciones

Dashboard SSE no funciona

Síntoma: Error "MIME type text/html instead of text/event-stream" Solución: Verificar que la configuración custom nginx para /api/dashboard-stream esté presente con proxy_buffering off

WebSocket no conecta

Síntoma: Error de conexión WebSocket Solución: Verificar que "Websockets Support" esté habilitado en la location /ws

API calls fallan

Síntoma: Errores 404 o 502 en calls de API Solución: Verificar que la location /api esté configurada correctamente apuntando a snatchgame:2567/api

Despliegue Automático

El sistema utiliza Gitea Actions para CI/CD:

1. Build de imagen Docker única
2. Deploy automático en contenedor snatchgame en red principal
3. Nginx proxy maneja el routing automáticamente

No se requiere reiniciar nginx tras deploys, solo el contenedor se actualiza.