Comprobador de aislamiento entre orígenes

Introduce la URL de cualquier sitio para averiguar si está aislado entre orígenes y si allí funcionarán SharedArrayBuffer y WebAssembly multihilo. El comprobador lee las cabeceras de respuesta Cross-Origin-Opener-Policy y Cross-Origin-Embedder-Policy de la URL y te indica qué falta. Solo lee las cabeceras; no se obtiene ni almacena nada más.

Por qué el aislamiento entre orígenes es importante para los juegos web

Algunas de las funciones más útiles del navegador están restringidas al aislamiento entre orígenes y, para los juegos, la más importante es SharedArrayBuffer, la memoria compartida que hace posible WebAssembly multihilo. Si tu motor distribuye una compilación web con varios hilos, no funcionará sin esta función:

• Las exportaciones web de Godot han requerido históricamente SharedArrayBuffer (Godot 4.3+ añadió una exportación de un solo hilo para evitar estas cabeceras).
• Las compilaciones WebGL multihilo de Unity lo necesitan.
• Los pthreads de Emscripten, ffmpeg.wasm y muchas bibliotecas de física y códecs también lo necesitan.

Sin aislamiento, el navegador tampoco permite usar temporizadores de alta resolución ni performance.measureUserAgentSpecificMemory(). Por tanto, si un juego multihilo no se carga sin mostrar ningún error o performance.now() parece sospechosamente impreciso, lo primero que debes hacer es comprobar el aislamiento.

Cómo funciona el aislamiento entre orígenes

Una página queda aislada entre orígenes cuando envía dos cabeceras de respuesta en el documento HTML:

Cross-Origin-Opener-Policy: same-origin
Cross-Origin-Embedder-Policy: require-corp

COOP: same-origin separa la página de otras ventanas que no comparten el mismo origen. COEP: require-corp indica que cada subrecurso debe autorizar explícitamente su inclusión. Cuando ambas están configuradas, self.crossOriginIsolated pasa a ser true y SharedArrayBuffer queda habilitado.

El problema está en COEP: una vez activado, cada recurso de otro origen (imágenes de CDN, fuentes, scripts e iframes) debe enviar Cross-Origin-Resource-Policy: cross-origin u obtenerse mediante CORS; de lo contrario, el navegador lo bloquea. Esta es la parte que suele causar problemas en los sitios. Si no puedes controlar tus recursos de terceros, usa Cross-Origin-Embedder-Policy: credentialless en su lugar, que carga los recursos de otros orígenes sin credenciales en vez de exigirles una autorización explícita.

Cómo habilitarlo

Cloudflare Pages (un archivo _headers):

/*
  Cross-Origin-Opener-Policy: same-origin
  Cross-Origin-Embedder-Policy: require-corp

Servidor de desarrollo de Vite (vite.config.js):

export default {
  server: {
    headers: {
      'Cross-Origin-Opener-Policy': 'same-origin',
      'Cross-Origin-Embedder-Policy': 'require-corp',
    },
  },
}

nginx:

add_header Cross-Origin-Opener-Policy same-origin;
add_header Cross-Origin-Embedder-Policy require-corp;

itch.io: activa «SharedArrayBuffer support» en las opciones de inserción de tu juego HTML; esto configurará las cabeceras por ti.

Después de desplegar, vuelve a cargar la página y ejecuta de nuevo el comprobador. crossOriginIsolated debería cambiar a true.

Preguntas frecuentes

¿Cómo compruebo si mi página está aislada entre orígenes?

Introduce la URL de tu sitio en el comprobador de arriba. Este lee en el servidor las cabeceras Cross-Origin-Opener-Policy y Cross-Origin-Embedder-Policy de la página y te indica si su combinación aísla la página. Para comprobarlo en tiempo de ejecución en tu propio navegador, abre la página y ejecuta crossOriginIsolated en la consola; devolverá true cuando el aislamiento esté activo.

¿Por qué SharedArrayBuffer es undefined?

Los navegadores solo exponen SharedArrayBuffer a las páginas aisladas entre orígenes. Si su valor es undefined, a tu página le faltan las cabeceras Cross-Origin-Opener-Policy: same-origin y Cross-Origin-Embedder-Policy: require-corp, o un recurso de otro origen está bloqueando el aislamiento bajo COEP. Configura las cabeceras (consulta la sección anterior) y vuelve a realizar la prueba.

¿Qué son COOP y COEP?

Cross-Origin-Opener-Policy (COOP) controla cómo interactúa una página con otras ventanas de navegación. Cross-Origin-Embedder-Policy (COEP) controla qué subrecursos pueden insertarse. Configurar juntos COOP: same-origin y COEP: require-corp hace que una página quede aislada entre orígenes, lo que habilita SharedArrayBuffer y otras funciones avanzadas.

Mi juego WebAssembly no se carga en el navegador. ¿Puede ser esta la causa?

A menudo, sí. Las compilaciones WebAssembly multihilo (algunas exportaciones web de Godot y Unity, los pthreads de Emscripten y ffmpeg.wasm) necesitan SharedArrayBuffer, que requiere aislamiento entre orígenes. Si el comprobador de arriba muestra «sin aislamiento», configura las cabeceras COOP/COEP o usa una compilación de un solo hilo del motor si está disponible.

¿Necesito la cabecera Cross-Origin-Resource-Policy?

No en la página que estás aislando. COOP y COEP son las cabeceras que aíslan un documento entre orígenes y se configuran en el propio documento. Cross-Origin-Resource-Policy (CORP) es una cabecera diferente que funciona en la dirección opuesta: se añade a un recurso de otro origen (una imagen, fuente o script) para permitir que una página que usa COEP: require-corp lo inserte. Por tanto, si el comprobador muestra que CORP «no está configurado» en tu página, es normal y no supone ningún problema. Solo tendrías que añadir CORP a los recursos que otras páginas aisladas necesiten cargar.

¿Activar COEP puede impedir que funcionen mis contenidos de terceros?

Sí, puede ocurrir. Con COEP: require-corp, cada recurso de otro origen debe enviar Cross-Origin-Resource-Policy o usar CORS; de lo contrario, se bloquea. Si insertas recursos de una CDN o scripts de terceros que no controlas, usa COEP: credentialless en su lugar para evitar ese requisito.

Contenido relacionado

• COOP/COEP y SharedArrayBuffer — el tutorial completo con código
• Comprobador de WebGL y WebGPU — prueba las capacidades de la GPU de tu navegador
• Web Workers para la lógica del juego — traslada el trabajo fuera del hilo principal
• Los mejores motores de juegos web para 2026 — qué motores necesitan varios hilos
• Motor Cinevva — nuestro motor diseñado para la web