Por qué necesitas el "aislamiento de origen cruzado" para obtener funciones potentes

Descubre por qué es necesario el aislamiento de origen cruzado para usar funciones eficaces, como SharedArrayBuffer, performance.measureUserAgentSpecificMemory() y el temporizador de alta resolución con mayor precisión.

Domenic Denicola
Domenic Denicola

Introducción

En Cómo hacer que tu sitio web esté "aislado entre orígenes cruzados" usando COOP y COEP explicamos cómo adoptar prácticas de "origen cruzado" aisladas" con COOP y COEP. Este es un artículo complementario que explica por qué se requiere el aislamiento de origen cruzado para habilitar funciones potentes en el navegador.

Información general

La Web se basa en el mismo origen política: una función de seguridad que restringe cómo los documentos y las secuencias de comandos pueden interactuar con recursos de otro origen. Esta restringe las formas en que los sitios web pueden acceder a recursos de origen cruzado. Para ejemplo, un documento de https://a.example no puede acceder a los datos alojado en https://b.example.

Sin embargo, la política del mismo origen tuvo algunas excepciones históricas. Cualquier sitio web puede hacer lo siguiente:

  • Cómo incorporar iframes de origen cruzado
  • Incluir recursos de origen cruzado, como imágenes o secuencias de comandos
  • Abre ventanas emergentes de origen cruzado con una referencia de DOM

Si la Web pudiera diseñarse desde cero, estas excepciones no existirían. Desafortunadamente, para cuando la comunidad web notó los beneficios clave de una estricta política del mismo origen, la Web ya se basaba en estas excepciones.

Los efectos secundarios de seguridad de esta política laxa del mismo origen se solucionaron en dos maneras. Una manera fue la introducción de un nuevo protocolo llamado Cross Uso compartido de recursos de origen (CORS) cuyo propósito es garantizar que el servidor permita compartir un recurso con un origen determinado. Otra forma es quitar implícitamente el acceso directo de la secuencia de comandos a recursos de origen cruzado mientras se preserva la retrocompatibilidad. Tales los recursos de origen cruzado se denominan "opacos" de Google Cloud. Por ejemplo, esta es la razón manipular los píxeles de una imagen de origen cruzado mediante CanvasRenderingContext2D falla a menos que se aplique CORS a la imagen.

Todas estas decisiones sobre políticas ocurren dentro de un grupo de contexto de navegación.

Grupo de contexto de navegación

Durante mucho tiempo, la combinación de CORS y recursos opacos fue suficiente para navegadores seguros. A veces, los casos extremos (como JSON este tipo de vulnerabilidades) de los usuarios fueron descubiertos y debían aplicar parches, pero, en general, el principio de no permitiendo el acceso de lectura directo a los bytes sin procesar de los recursos de origen cruzado y exitoso.

Todo esto cambió con Spectre, que hace que cualquier dato que se cargue en el mismo grupo de contextos de navegación que tu código potencialmente legibles. Al medir el tiempo que tardan ciertas operaciones, los atacantes puede adivinar el contenido de las memorias caché de la CPU y, con ello, el contenido de la proceso memoria. Esos ataques de tiempo son posibles con cronómetros de bajo nivel de detalle disponibles en la plataforma, pero que se pueden acelerar con cronómetros de alto nivel de detalle, explícito (como performance.now()) e implícito (como SharedArrayBuffer). Si evil.com incorpora una imagen de origen cruzado, puede usar un Spectre para leer sus datos de píxeles, lo que hace que las protecciones dependan de "opacidad" ineficaz.

Espectro

Idealmente, el servidor debe aprobar de forma explícita todas las solicitudes de origen cruzado propietario del recurso. Si no proporciona la verificación servidor propietario de los recursos, los datos nunca llegarán al grupo de contexto de un actor malvado y, por lo tanto, se mantendrá fuera del alcance de cualquier espectro que una página web puede llevar a cabo. Lo llamamos un estado aislado de origen cruzado. De eso se trata COOP+COEP.

En un estado aislado de origen cruzado, el sitio solicitante se considera menos peligroso, y esto desbloquea funciones potentes, como SharedArrayBuffer, performance.measureUserAgentSpecificMemory() y alta resolución cronómetros con mayor precisión, lo que podría para ataques similares a los de un especie Spectre. También evita la modificación document.domain

Política de incorporaciones de origen cruzado

Incorporador de origen cruzado (COEP) evita que documento no cargue ningún recurso de origen cruzado que no otorgue explícitamente el permiso del documento (con CORP o CORS). Con esta función, puedes declarar que un documento no puede cargar tales recursos.

Cómo funciona el COEP

Para activar esta política, agrega el siguiente encabezado HTTP al documento:

Cross-Origin-Embedder-Policy: require-corp

La palabra clave require-corp es el único valor aceptado para COEP. Esto aplica la política de que el documento solo puede cargar recursos del mismo origen recursos marcados de forma explícita como cargables desde otro origen.

Para que los recursos se puedan cargar desde otro origen, deben admitir Uso compartido de recursos entre dominios (CORS) o Política de recursos entre dominios (CORP).

Uso compartido de recursos entre dominios

Si un recurso de origen cruzado admite el uso compartido de recursos entre dominios (CORS), puedes usar el crossorigin para cargarlo en tu página web sin que el COEP te bloquee.

<img src="https://third-party.example.com/image.jpg" crossorigin>

Por ejemplo, si este recurso de imagen se entrega con encabezados CORS, usa el El atributo crossorigin para que la solicitud para recuperar el recurso use CORS automático. Esto también impide que se cargue la imagen, a menos que establezca encabezados de CORS.

Del mismo modo, puedes recuperar datos de origen cruzado a través del método fetch(), que no requiere un tratamiento especial, siempre que el servidor responda con la respuesta HTTP encabezados.

Política de recursos entre dominios

Política de recursos multiorigen (CORP) se introdujo originalmente como una habilitación para proteger tus recursos contra cargado por otro origen. En el contexto de COEP, CORP puede especificar el recurso política del propietario para determinar quién puede cargar un recurso.

El encabezado Cross-Origin-Resource-Policy acepta tres valores posibles:

Cross-Origin-Resource-Policy: same-site

Los recursos marcados como same-site solo se pueden cargar desde el mismo sitio.

Cross-Origin-Resource-Policy: same-origin

Los recursos marcados como same-origin solo se pueden cargar desde el mismo origen.

Cross-Origin-Resource-Policy: cross-origin

Cualquier sitio web puede cargar los recursos marcados como cross-origin. (Este value se agregó al las especificaciones de CORP y COEP).

Política de abridor de origen cruzado

Política del abridor de origen cruzado (COOP) te permite garantizar que una ventana de nivel superior se aísle de otros documentos al colocarlos en una grupo de contextos de navegación diferente, de modo que no puedan interactuar directamente con el ventana de nivel superior. Por ejemplo, si un documento con COOP abre una ventana emergente, su La propiedad de window.opener será null. Además, la propiedad .closed de la la referencia del abridor mostrará true.

COOP

El encabezado Cross-Origin-Opener-Policy acepta tres valores posibles:

Cross-Origin-Opener-Policy: same-origin

Los documentos marcados como same-origin pueden compartir el mismo contexto de navegación grupo con documentos del mismo origen que también se marcan de forma explícita como same-origin.

COOP

Cross-Origin-Opener-Policy: same-origin-allow-popups

Un documento de nivel superior con same-origin-allow-popups conserva las referencias a cualquier de sus ventanas emergentes que no configuran COOP o que inhabilitan el aislamiento por estableciendo un COOP de unsafe-none.

COOP

Cross-Origin-Opener-Policy: unsafe-none

unsafe-none es la opción predeterminada y permite que el documento se agregue al menú de apertura. grupo de contexto de navegación, a menos que el objeto de apertura tenga un COOP de same-origin.

Resumen

Si quieres tener acceso garantizado a funciones potentes, como SharedArrayBuffer, performance.measureUserAgentSpecificMemory() o alta resolución cronómetros con mayor precisión, solo recuerda que tu documento debe usar COEP con el valor de require-corp y COOP con el valor de same-origin. En caso de que no exista ninguna de estas opciones, el navegador No garantizamos un aislamiento suficiente para habilitar esas funciones potentes. Tú puede determinar la situación de tu página comprobando si self.crossOriginIsolated muestra true.

Consulta los pasos para implementar esto en el artículo Crea un sitio web "de origen cruzado" aisladas" usando COOP y COEP.

Recursos