jquery.app
Espanol
EnglishDeutschFrancaisEspanol日本語Nederlands

Herramientas GitHub Pages

Gratis Generador de cabeceras COOP/COEP/CORP

Configura cabeceras de aislamiento cross-origin para SharedArrayBuffer, WASM y seguridad.

Cargando herramienta...

Qué es Generador de cabeceras COOP/COEP/CORP?

El aislamiento entre orígenes es un conjunto de encabezados HTTP que controlan cómo una página interactúa con ventanas y recursos de otros orígenes. COOP controla si esta página puede ser accedida por otros orígenes a través de window.opener. COEP controla si se pueden cargar recursos entre orígenes (imágenes, fuentes, scripts). CORP controla si este recurso puede ser cargado por otros orígenes. Juntos habilitan funciones potentes como SharedArrayBuffer y temporizadores de alta resolución.

Respuesta rápida

Construya encabezados de aislamiento entre orígenes para SharedArrayBuffer y seguridad de opener. COOP controla el acceso a window.opener. COEP controla la carga de recursos entre orígenes. CORP controla si otros orígenes pueden cargar sus recursos. Use el preset moderado para la mayoría de los sitios que necesitan aislamiento con soporte para embeds de terceros.

Last updated: 2026-05-28

Limitaciones

  • El aislamiento entre orígenes es una restricción potente que puede romper silenciosamente embeds de terceros, recursos CDN, análisis y fuentes. Pruebe exhaustivamente en cada tipo de página antes de aplicarlo.
  • COEP credentialless es compatible con Chrome 113+, Edge 113+ y Firefox 128+. Los navegadores más antiguos y Safari pueden no ser compatibles, lo que causa que los recursos entre orígenes fallen.
  • Algunas plataformas de alojamiento (incluyendo GitHub Pages) no admiten la configuración de encabezados COOP/COEP/CORP personalizados. Use un CDN o proxy inverso (Cloudflare, Netlify) delante para agregarlos.

Sources:MDN Web Docs · W3C Specifications · jquery.app on GitHub

Cómo usar esta herramienta

  1. Seleccione un preset de objetivo de aislamiento o elija personalizado para configurar cada encabezado individualmente.
  2. Revise los valores de los encabezados — un aislamiento más estricto habilita más funciones pero puede romper embeds de terceros.
  3. Copie los encabezados y agréguelos a la configuración de su servidor o CDN.
  4. Use la lista de verificación de depuración para identificar recursos rotos después de la implementación.

Para qué puedes usarla

  • Habilitar SharedArrayBuffer y funciones avanzadas de WebAssembly para una aplicación web de uso intensivo de cómputo.
  • Aislar la relación opener de una página para prevenir ataques entre orígenes mientras se siguen cargando imágenes de CDN y fuentes de terceros.
  • Configurar un aislamiento mínimo que evite el acceso a opener pero no restrinja la carga de recursos incrustados.

Casos de uso

Ejemplos prácticos

Ejemplo

Aplicación web de uso intensivo de cómputo

Una aplicación web necesita SharedArrayBuffer para procesamiento de audio en tiempo real. Use el preset de aislamiento completo: COOP same-origin, COEP require-corp, CORP same-origin. Todos los recursos de terceros deben enviar encabezados CORP o cargarse con crossorigin.

Ejemplo

Sitio estático con embeds de terceros

Un blog usa Google Fonts, un CDN para imágenes y videos de YouTube incrustados. Use el preset moderado con COEP credentialless para que los recursos de terceros se carguen sin encabezados CORP mientras se mantiene el aislamiento de opener.

Errores comunes

  • Configurar COEP require-corp sin asegurarse de que todos los recursos de terceros envíen encabezados CORP — las imágenes, fuentes y scripts de CDN fallarán silenciosamente.
  • Usar COOP same-origin cuando la página necesita comunicarse con ventanas emergentes o usar flujos de redirección OAuth — las ventanas emergentes no pueden acceder a window.opener.
  • Olvidar que COEP credentialless es más nuevo y no es compatible con todos los navegadores — verifique la compatibilidad del navegador antes de implementar.

Verificación

  1. Abra la consola de DevTools y verifique si hay errores de bloqueo CORP/COEP después de implementar los encabezados.
  2. Use crossOriginIsolated en la consola: self.crossOriginIsolated debería devolver true si el aislamiento completo funciona correctamente.

FAQ

Preguntas sobre Generador de cabeceras COOP/COEP/CORP

Cuál es la diferencia entre COEP require-corp y credentialless?

require-corp requiere que CADA recurso entre orígenes envíe un encabezado Cross-Origin-Resource-Policy o se cargue con el atributo crossorigin. credentialless es una alternativa más nueva que elimina automáticamente las credenciales de las solicitudes entre orígenes, permitiendo que los recursos de terceros se carguen sin encabezados CORP. credentialless es más compatible con CDN y contenido de terceros existentes.

Necesito aislamiento entre orígenes para mi sitio?

Solo si necesita SharedArrayBuffer, performance.now() de alta resolución (precisión de microsegundos) o funciones específicas de WebAssembly. La mayoría de los sitios de contenido, blogs y sitios de comercio electrónico NO necesitan aislamiento entre orígenes. Comience con el preset relajado y aumente el aislamiento solo si su aplicación web requiere las funciones que habilita.

Herramientas relacionadas

Más herramientas github pages

Prueba también

Prueba también