Encabezados de Seguridad (CORS) en MiPanel
¿Qué son los Encabezados de Seguridad?
Los encabezados de seguridad son instrucciones que tu servidor envía a los navegadores para decirles cómo debe comportarse tu sitio web. Son como reglas de seguridad que protegen a tus visitantes y tu sitio.
Piensa en ellos como un seguro de seguridad digital: aunque no los veas, trabajan en segundo plano para evitar que hackers ataquen tu sitio.
¿Por qué son importantes?
Sin estos encabezados, tu sitio web puede ser vulnerable a:
- Clickjacking: Un atacante superpone elementos invisibles sobre tu página para que los usuarios hagan clic en algo que no querían.
- Sniffing de contenido: Alguien puede "escuchar" qué tipo de archivos está cargando tu sitio.
- Ataques cross-origin: Sitios maliciosos pueden intentar acceder a datos de tu sitio.
- Inyección de scripts: Atacantes pueden inyectar código malicioso en tu página.
Guía de cada Encabezado
1. X-DNS-Prefetch-Control
¿Qué hace? Controla si el navegador debe buscar (pre-cargar) los servidores DNS de los dominios que mencionas en tu página.
| Opción | Descripción |
|---|---|
| En (On) | El navegador busca los DNS anticipadamente → tu sitio carga más rápido |
| Apagado (Off) | No busca DNS anticipadamente → más privado, pero más lento |
Recomendación: Déjalo en En para mejores tiempos de carga.
2. X-Frame-Options
¿Qué hace? Decide si tu sitio puede mostrarse dentro de un iframe (un sitio dentro de otro sitio).
| Opción | Descripción |
|---|---|
| DENY | Nadie puede incrustar tu sitio en un iframe → máxima seguridad |
| SAMEORIGIN | Solo tu propio sitio puede incrustarlo → balance seguridad/funcionalidad |
Recomendación: Usa SAMEORIGIN si necesitas que tu sitio se muestre en dashboards. Usa DENY si no necesitas iframe.
Caso de uso: Si tu sitio tiene un panel de administración, SAMEORIGIN es ideal.
3. X-Content-Type-Options
¿Qué hace? Impide que el navegador "adivine" el tipo de archivo y ejecute scripts peligrosos.
| Opción | Descripción |
|---|---|
| nosniff | El navegador solo ejecuta archivos con el tipo correcto → previene ataques de tipo MIME |
Recomendación: Siempre activa nosniff. Es una capa extra de seguridad sin desventajas.
4. Referrer-Policy
¿Qué hace? Controla cuánta información sobre la página de origen se envía cuando un usuario hace clic en un enlace hacia otro sitio.
| Opción | Descripción |
|---|---|
| no-referrer | No envía ninguna información → máxima privacidad |
| no-referrer-when-downgrade | Envía info solo si la conexión se mantiene HTTPS |
| origin | Solo envía el dominio, no la ruta completa |
| origin-when-cross-origin | Envía todo si es el mismo dominio, solo origen si es otro sitio |
| same-origin | Solo envía info a sitios del mismo dominio |
| strict-origin | Envía origen solo si la seguridad no cambia |
| strict-origin-when-cross-origin | Equilibrado: envía todo al mismo sitio, origen a otros |
| unsafe-url | Envía toda la información (URL completa) → no recomendado |
Recomendación: Usa strict-origin-when-cross-origin para balance entre privacidad y funcionalidad analytics.
5. Cross-Origin-Resource-Policy (CORS)
¿Qué hace? Controla quién puede cargar los recursos (imágenes, scripts, etc.) de tu sitio.
| Opción | Descripción |
|---|---|
| same-site | Solo el mismo sitio puede cargar recursos |
| same-origin | Solo el mismo dominio (no subdominios) |
| cross-origin | Cualquier sitio puede cargar recursos |
Recomendación: Usa same-site para máxima seguridad. Usa cross-origin si necesitas que otros sitios carguen tus imágenes o scripts.
Caso de uso: Si tienes un blog y quieres que otros sites compartan tus imágenes, usa cross-origin.
6. Cross-Origin-Opener-Policy (COOP)
¿Qué hace? Controla si tu sitio puede abrir ventanas o pestañas de otros sitios y viceversa.
| Opción | Descripción |
|---|---|
| unsafe-none | Sin restricciones → comportamiento normal |
| same-origin-allow-popups | Permite ventanas emergentes del mismo origen |
| same-origin | Solo permite interacción con el mismo sitio |
Recomendación: Usa same-origin-allow-popups si tu sitio usa ventanas emergentes (popups) para login o formularios.
7. Cross-Origin-Embedder-Policy (COEP)
¿Qué hace? Controla si tu sitio puede incrustar recursos de otros orígenes.
| Opción | Descripción |
|---|---|
| unsafe-none | Sin restricciones |
| require-corp | Todos los recursos cross-origin necesitan permiso explícito |
Recomendación: Usa require-corp si tu sitio maneja datos sensibles o financieros.
8. Strict-Transport-Security (HSTS)
¿Qué hace? Fuerza a los navegadores a usar solo HTTPS (conexión segura).
Ejemplo de configuración:
max-age=31536000; includeSubDomains; preload
| Parámetro | Descripción |
|---|---|
| max-age | Tiempo en segundos que el navegador recuerda usar HTTPS (31536000 = 1 año) |
| includeSubDomains | Aplica también a subdominios |
| preload | Permite que tu sitio se incluya en la lista de navegadores que fuerzan HTTPS |
Recomendación: Configura max-age=31536000 para proteger a tus visitantes durante 1 año.
9. X-XSS-Protection
¿Qué hace? Activa el filtro de XSS (Cross-Site Scripting) del navegador.
Ejemplo de configuración:
1; mode=block
| Valor | Descripción |
|---|---|
| 1 | Activa el filtro |
| 0 | Desactiva el filtro (no recomendado) |
| 1; mode=block | Activa y bloquea la página si detecta un ataque |
Recomendación: Usa 1; mode=block para protección activa contra XSS.
10. Content-Security-Policy (CSP)
¿Qué hace? Define desde qué fuentes confiables se pueden cargar scripts, estilos, imágenes y otros recursos.
Ejemplo de configuración:
default-src 'self'; script-src 'self' https://trusted-cdn.com; style-src 'self' 'unsafe-inline';
| Directiva | Qué controla |
|---|---|
| default-src | Fuente por defecto para todo |
| script-src | Fuentes de JavaScript |
| style-src | Fuentes de CSS |
| img-src | Fuentes de imágenes |
| font-src | Fuentes de tipografías |
Recomendación: Empieza con una política estricta y ve relajando según tus necesidades.
11. Permissions-Policy
¿Qué hace? Controla qué funciones del navegador puede usar tu sitio (cámara, micrófono, geolocalización, etc.).
Ejemplo de configuración:
camera=(), microphone=(), geolocation=(self)
| Directiva | Descripción |
|---|---|
| camera=() | Desactiva acceso a cámara |
| microphone=() | Desactiva acceso a micrófono |
| geolocation=(self) | Solo tu sitio puede acceder a ubicación |
Recomendación: Desactiva las funciones que no uses para mayor seguridad.
Configuración Recomendada por Tipo de Sitio
Sitio Informativo / Blog
| Encabezado | Valor Recomendado |
|---|---|
| X-Frame-Options | SAMEORIGIN |
| X-Content-Type-Options | nosniff |
| Referrer-Policy | strict-origin-when-cross-origin |
| Cross-Origin-Resource-Policy | cross-origin |
| Strict-Transport-Security | max-age=31536000 |
Tienda Online / E-commerce
| Encabezado | Valor Recomendado |
|---|---|
| X-Frame-Options | DENY |
| X-Content-Type-Options | nosniff |
| Referrer-Policy | same-origin |
| Cross-Origin-Resource-Policy | same-site |
| Cross-Origin-Opener-Policy | same-origin |
| Strict-Transport-Security | max-age=31536000; includeSubDomains |
Panel de Administración
| Encabezado | Valor Recomendado |
|---|---|
| X-Frame-Options | DENY |
| X-Content-Type-Options | nosniff |
| Referrer-Policy | no-referrer |
| Cross-Origin-Opener-Policy | same-origin |
| Strict-Transport-Security | max-age=31536000; includeSubDomains |
Paso a Paso: Configurar Encabezados en MiPanel
Paso 1: Acceder al Panel
- Ve a https://cp.mipanel.cloud
- Inicia sesión con tus credenciales
Paso 2: Seleccionar tu Servicio
- En el menú lateral, haz clic en "Su cuenta"
- Selecciona el servicio que deseas configurar (Cloud Hosting, Moodle Hosting o WordPress Hosting)
Paso 3: Abrir Encabezados de Seguridad
- En la sección CDN, haz clic en "Encabezados de seguridad"
Paso 4: Configurar los Encabezados
- X-DNS-Prefetch-Control: Selecciona En
- X-Frame-Options: Selecciona SAMEORIGIN (o DENY si es un panel)
- X-Content-Type-Options: Selecciona nosniff
- Referrer-Policy: Selecciona strict-origin-when-cross-origin
- Cross-Origin-Resource-Policy: Selecciona same-site
- Cross-Origin-Opener-Policy: Selecciona same-origin-allow-popups
- Cross-Origin-Embedder-Policy: Déjalo en unsafe-none (a menos que tengas requisitos específicos)
- Strict-Transport-Security: Escribe
max-age=31536000 - X-XSS-Protection: Escribe
1; mode=block
Paso 5: Guardar
- Haz clic en el botón "Save Headers" (Guardar Encabezados)
Consejos Importantes
-
No configures todos los encabezados de golpe. Empieza con los básicos y ve añadiendo según necesites.
-
Prueba después de cada cambio. Abre tu sitio en el navegador y verifica que todo funcione correctamente.
-
Revisa las consolas del navegador. Si algo se rompe, verás errores en la consola (F12 → Console).
-
Usa herramientas de verificación:
- Security Headers - Analiza tu sitio
- Mozilla Observatory - Auditoría completa
-
Los encabezados del CDN se aplican a todas las páginas de tu sitio automáticamente.
Preguntas Frecuentes
¿Estos encabezados afectan la velocidad de mi sitio? No. Los encabezados de seguridad son muy ligeros y no afectan el rendimiento.
¿Puedo romper mi sitio con estos encabezados? Si configuras CSP o COEP de forma muy estricta, algunos recursos pueden no cargar. Si algo se rompe, desactiva el último encabezado que configuraste.
¿Los encabezados reemplazan al SSL? No. Los encabezados complementan al certificado SSL. Necesitas ambos para máxima seguridad.
¿Funcionan con todos los navegadores? La mayoría son compatibles con todos los navegadores modernos. Algunos como COEP pueden no funcionar en navegadores muy antiguos.