🔧 Configuraciones

Objetivo: Configuraciones específicas y listas para usar según tu tipo de proyecto, basadas en casos reales del equipo.

Tip

¿Vienes del Decision Tree? Perfecto. Aquí encontrarás la configuración específica que identificaste como necesaria para tu proyecto.

---

🧩 Handlers Generales

📍 ¿Qué son los Handlers?

Los handlers son snippets reutilizables que definen cómo Caddy debe manejar rutas específicas. En nuestro entorno, cada handler redirige ciertas rutas a servicios externos especializados, permitiendo que tu aplicación local integre seamlessly con la arquitectura de microservicios.

Concepto clave: Tu aplicación ASP.NET local maneja la mayoría de rutas, pero ciertas rutas específicas (/offer, /chk, /purchase, /wibble) se proxy automáticamente a servicios externos especializados.

---

📂 Estructura en el Caddyfile

⚠️ ORDEN CRÍTICO: Los handlers van en este orden específico en tu Caddyfile:

# 🌐 1. Global Options (OBLIGATORIO)
{
    auto_https disable_redirects
}

# 🧩 2. HANDLERS (van aquí, después de global options)
(cors) { ... }
(offer-handler) { ... }
(payment-handler) { ... }
# ... otros handlers

# 🌐 3. CONFIGURACIÓN DE SITIO (van al final)
https://mi-tenant.local {
    tls internal

    # ⚡ ORDEN DE IMPORTS (importa el orden!)
    import offer-handler    # ← Primer matcher
    import payment-handler     # ← Segundo matcher

    # Motor principal (fallback)
    reverse_proxy mi-tenant.local:80 { ... }
}

Caution

¿Por qué importa el orden de imports?

Caddy evalúa las rutas en orden de definición. El primer handler que haga match procesará la request. Si cambias el orden, puedes romper el routing.

---

🎯 Handlers Principales (Copy-Paste Ready)

🌐 CORS Handler

(cors) {
  @cors_preflight method OPTIONS

  header {
    Access-Control-Allow-Origin "{header.origin}"
    Vary Origin
    Access-Control-Expose-Headers "Authorization"
    Access-Control-Allow-Credentials "true"
  }

  handle @cors_preflight {
    header {
      Access-Control-Allow-Methods "GET, POST, PUT, PATCH, DELETE"
      Access-Control-Allow-Headers "Authorization, Content-Type, X-Requested-With, Accept, Origin, Cache-Control, Pragma"
      Access-Control-Max-Age "3600"
    }
    respond "" 204
  }
}

¿Qué hace? Maneja requests CORS para APIs externas
¿Cuándo usarlo? Siempre que tengas frontend JavaScript consumiendo APIs

---

🎯 Offer Handler (Ofertas/Landings)

(offer-handler) {
  handle_path /ofertas/* {
    # Reescribir la URL para incluir /render antes del resto del path
    rewrite * /render{http.request.uri.path}

        # reverse_proxy http://localhost:5250
    reverse_proxy https://landings.xxxxxxx.com {
      header_up Host {host} # Usar el host actual
      transport http {
        tls_insecure_skip_verify # Similar a verify none
      }
    }
  }
}

¿Qué hace? Maneja landings dinámicas

---

💳 Payment Handler (Pagos)

(payment-handler) {
  handle_path /chk/* {
    # Enviar directamente al backend de pagos
    reverse_proxy pagos.xxxxxxx.com:443 {
      header_up Host {host} # Usar el host actual
      transport http {
        tls_insecure_skip_verify # Similar a verify none
      }
    }
  }
}

¿Qué hace? Maneja todo el flujo de pasarela de pagos

---

🌐 Handler CDN (Assets)

(cdn-handler) {
  # Configuración TLS automática
  tls internal

  # Configuración por archivo especifico
  handle_path /Scripts/ejemplo1.txt {
    root * C:\inetpub\cdn\Scripts\ejemplo1.txt
    file_server
  }

  # Configuración por carpeta
  handle_path /Scripts/sc-components/* {
    root * C:\inetpub\cdn\Scripts\sc-components
    file_server
  }

  handle_path /Scripts/activity-details/* {
    root * C:\inetpub\cdn\Scripts\activity-details
    file_server
  }

  # Configuración por carpeta
  handle_path /Scripts/admin-complementarios/* {
    root * C:\inetpub\cdn\Scripts\admin-complementarios
    file_server
  }

  # Fallback
  handle {
    reverse_proxy https://xxxxx.cdn.com {
      header_up Host xxxxx.cdn.com
    }
  }
}

¿Qué hace? Sirve assets estáticos desde local o fallback a CDN
¿Cuándo usarlo? Desarrollo frontend o debugging de assets específicos

---

✅ Cómo Usar los Handlers

1. Copia los handlers que necesites del código completo de arriba al inicio de tu Caddyfile

2. En tu configuración de sitio, importa en este orden:

https://mi-motor.local {
    tls internal

    # Orden específico (primer match gana)
    import offer-handler
    import payment-handler

    # Tu aplicación (fallback)
    reverse_proxy mi-motor.local:80 {
        header_up Host mi-motor.local
        header_up x-origin-site mi-motor.local
        header_up HTTP_X_FRONTEND_HTTPS on
    }
}

3. Personaliza según tu proyecto:

• Solo algunos servicios: Importa solo los handlers que necesites

Tip

🚀 Copy-Paste Complete

Ahora tienes todo el código completo de cada handler. Simplemente:

1. Copia los handlers que necesites
2. Pégalos después de los global options en tu Caddyfile
3. Importa en el orden correcto en tu configuración de sitio
4. ¡Listo para usar!

---

📋 Configuraciones Disponibles

Configuraciones Principales

🎨 Frontend/CDN

Para: Desarrollo Vue.js, microfrontends, assets Incluye: Vue dev server + CORS + HMR Ir a: Frontend/CDN

🔧 API Simple

Para: APIs .NET Core independientes Incluye: Proxy simple + CORS + HTTPS Ir a: API Simple

🏗️ Landings Local

Para: Desarrollo de landings, servicios especializados

Incluye: Servicio local + testing de handlers

Ir a: Landings Local

---

🎨 Frontend/CDN

Para desarrollo frontend intensivo

Basado en: Proyectos Vue.js, microfrontends, assets locales

Vue.js Dev Server

{
    auto_https disable_redirects
}

https://frontend.local {
    tls internal

    # CORS para desarrollo
    import cors

    # Microfrontends específicos
    handle_path /Scripts/sc-components/* {
        reverse_proxy localhost:5173 {  # Vite dev server
            header_up Host {host}
        }
    }

    handle_path /Scripts/activity-details/* {
        reverse_proxy localhost:5174 {  # Otro microfrontend
            header_up Host {host}
        }
    }

    # CDN fallback
    reverse_proxy https://b2b2c.cdnpt.com {
        header_up Host b2b2c.cdnpt.com
    }
}

# Dev servers directos
https://vite.local {
    tls internal
    reverse_proxy localhost:5173
}

https://components.local {
    tls internal
    reverse_proxy localhost:5174
}

Hot Module Reload

# Configuración específica para HMR
{
    auto_https disable_redirects
}

https://hmr.local {
    tls internal

    # WebSocket para HMR
    handle_path /ws {
        reverse_proxy localhost:5173 {
            header_up Upgrade {http.request.header.Upgrade}
            header_up Connection {http.request.header.Connection}
        }
    }

    # Assets con hot reload
    handle_path /src/* {
        reverse_proxy localhost:5173
    }

    handle_path /@vite/* {
        reverse_proxy localhost:5173
    }

    # Motor principal
    reverse_proxy localhost:80 {
        header_up Host {host}
        header_up HTTP_X_FRONTEND_HTTPS on
    }
}

---

🔧 API Simple

Para APIs .NET Core independientes

{
    auto_https disable_redirects
}

https://mi-api.local {
    tls internal

    # CORS si es necesario
    import cors

    # API directa
    reverse_proxy localhost:5001 {  # Puerto típico de .NET Core API
        header_up Host {host}
        header_up HTTP_X_FRONTEND_HTTPS on
    }
}

# Configuración con múltiples APIs
https://api-gateway.local {
    tls internal

    import cors

    # Routing por path
    handle_path /v1/* {
        reverse_proxy localhost:5001  # API v1
    }

    handle_path /v2/* {
        reverse_proxy localhost:5002  # API v2
    }

    handle_path /auth/* {
        reverse_proxy localhost:5003  # Servicio de auth
    }

    # Health checks
    handle_path /health {
        respond "OK" 200
    }
}

---

🏗️ Landings Local

Para desarrollo del servicio de landings

{
    auto_https disable_redirects
}

# Handlers específicos para landings local
(offer-handler-local) {
    handle_path /ofertas-de-viajes/* {
        rewrite * /render{http.request.uri.path}
        reverse_proxy http://localhost:5250 {
            header_up Host {host}
        }
    }
}

https://landings.local {
    tls internal

    # Servicio de landings directo
    reverse_proxy localhost:5250 {
        header_up Host {host}
    }
}

https://motor-con-landings.local {
    tls internal

    # Otros servicios remotos + landings local
    import wibble-handler      # → Remoto
    import offer-handler-local # → Local (puerto 5250)
    import chk-handler         # → Remoto
    import purchase-handler    # → Remoto

    # Motor principal
    reverse_proxy localhost:80 {
        header_up Host motor-con-landings.local
        header_up HTTP_X_FRONTEND_HTTPS on
    }
}

Testing de Landings

# Test básico del servicio
Test-NetConnection localhost -Port 5250

# Test de endpoints específicos
$testUrls = @(
    "https://landings.local/render/ofertas-de-viajes/test",
    "https://landings.local/health",
    "https://motor-con-landings.local/ofertas-de-viajes/cancun-hoteles"
)

foreach ($url in $testUrls) {
    try {
        $response = Invoke-WebRequest -Uri $url -UseBasicParsing
        Write-Host "✅ $url - $($response.StatusCode)" -ForegroundColor Green
    } catch {
        Write-Host "❌ $url - Error" -ForegroundColor Red
    }
}

---

🔄 Próximos Pasos

Con tu configuración lista:

1. 🚨 Troubleshooting: Soluciones a problemas comunes específicos

Tip

¿Tu caso es híbrido? Combina elementos de diferentes configuraciones. Los snippets son modulares - puedes mezclar handlers normales y multi, agregar servicios locales según necesites, etc.