이 페이지는 Cloud Translation API를 통해 번역되었습니다.

강력한 기능을 위해 '교차 출처 분리'가 필요한 이유

정밀도가 더 높은 SharedArrayBuffer, performance.measureUserAgentSpecificMemory(), 고해상도 타이머와 같은 강력한 기능을 사용하는 데 교차 출처 분리가 필요한 이유를 알아보세요.

Eiji Kitamura

Domenic Denicola

소개

웹사이트를 '교차 출처 분리'로 설정 COOP 및 COEP에서는 '교차 출처'를 채택하는 방법을 격리' 상태를 변경할 수 있습니다. 이 도움말은 브라우저에서 강력한 기능을 사용 설정하는 데 교차 출처 분리가 필요한 이유

배경

웹은 동일 출처에서 정책: 다른 출처의 리소스와 문서 및 스크립트가 상호작용하는 방법을 설명합니다. 이 웹사이트에서 교차 출처 리소스에 액세스하는 방식을 제한합니다. 대상 예: https://a.example의 문서가 데이터에 액세스할 수 없음 https://b.example에 주최됩니다.

그러나 이전에는 동일 출처 정책에 몇 가지 예외가 있었습니다. 모든 웹사이트에서 가능한 작업:

교차 출처 iframe 삽입
이미지 또는 스크립트와 같은 교차 출처 리소스 포함
DOM 참조로 교차 출처 팝업 창 열기

웹을 처음부터 설계할 수 있다면 이러한 예외는 존재하지 않습니다. 불행히도, 웹 커뮤니티가 웹 생태계의 주요 이점을 깨닫게 되었을 무렵에는 웹에서는 이미 이러한 예외를 적용하고 있었습니다.

이처럼 느슨한 동일 출처 정책의 보안 부작용은 있습니다. 한 가지 방법은 새 프로토콜인 Cross 출처 리소스 공유 (CORS) 해당 서버와의 리소스 공유를 허용하도록 하는 것이 목적입니다. 나타냅니다. 다른 방법은 이전 버전과의 호환성을 유지하면서 여러 출처의 리소스를 지원할 수 있습니다 이러한 교차 출처 리소스를 '불투명' 리소스라고 함 리소스를 배포합니다 예를 들어 CanvasRenderingContext2D를 통해 교차 출처 이미지의 픽셀 조작 이미지에 CORS가 적용되지 않으면 실패합니다.

이러한 모든 정책 결정은 탐색 컨텍스트 그룹 내에서 이루어집니다.

컨텍스트 그룹 둘러보기

오랫동안 CORS와 불투명 리소스의 조합만으로도 안전합니다. 경우에 따라 특이한 사례 (예: JSON) 취약점이 있는 경우) 패치가 필요했지만 전반적으로 교차 출처 리소스의 원시 바이트에 대한 직접 읽기 액세스를 허용하는 것은 있습니다.

이 모든 것이 Spectre: 코드와 동일한 브라우징 컨텍스트 그룹에 로드되는 모든 데이터를 만듭니다. 될 수 있습니다. 특정 작전에 소요되는 시간을 측정함으로써 공격자는 CPU 캐시의 내용을 추측할 수 있으며, 이를 통해 프로세스 사용할 수 있습니다 이러한 타이밍 공격은 세분화된 타이머로도 가능합니다. 플랫폼 내에 있지만 세분화된 타이머로 처리 속도를 높일 수 있는 명시적 (예: performance.now()) 및 암시적 (예: SharedArrayBuffer). evil.com에 교차 출처 이미지가 삽입되는 경우 픽셀 데이터를 읽는 스펙터 공격으로, 스펙터 공격을 통해 '불투명' 효과가 없습니다.

스펙터

서버에서 모든 교차 출처 요청을 명시적으로 검사하는 것이 이상적입니다. kube-APIserver입니다 심사가 제공되지 않는 경우 그렇게 하지 않으면 데이터가 컨텍스트 그룹이므로 스펙터에는 접근이 용이하지 않습니다. 모든 공격의 흔적을 확인합니다. 이를 교차 출처 분리 상태라고 합니다. COOP+COEP의 기능이 바로 이것입니다.

교차 출처 분리 상태에서는 요청 사이트가 더 낮은 것으로 간주됩니다. 위험하며 이렇게 하면 SharedArrayBuffer, performance.measureUserAgentSpecificMemory() 및 고해상도 타이머와 같은 더 나은 정밀도를 가질 수 있었습니다. 스펙터 같은 공격에 사용할 수 있습니다. 또한 포드의 상태를 document.domain

교차 출처 삽입 정책

교차 출처 임베딩 정책 (COEP)은 Google에서 명시적으로 권한을 부여하지 않은 교차 출처 리소스를 로드하지 못하도록 문서 권한을 요청합니다 (CORP 또는 CORS 사용). 이 기능을 사용하면 문서에서 이러한 리소스를 로드할 수 없음을 의미합니다.

COEP 작동 방식

이 정책을 활성화하려면 문서에 다음 HTTP 헤더를 추가하세요.

Cross-Origin-Embedder-Policy: require-corp

require-corp 키워드는 COEP에 허용되는 유일한 값입니다. 이렇게 하면 문서가 동일한 출처의 리소스만 로드할 수 있다는 정책 명시적으로 다른 출처에서 로드 가능한 것으로 표시된 리소스를 반환합니다.

리소스를 다른 출처에서 로드하려면 교차 출처 리소스 공유 (CORS) 또는 교차 출처 리소스 정책 (CORP)

교차 출처 리소스 공유

교차 출처 리소스가 교차 출처 리소스 공유를 지원하는 경우 (CORS)의 경우 crossorigin 속성 을 사용하면 COEP에 의해 차단되지 않고 웹페이지에 로드할 수 있습니다.

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

예를 들어 이 이미지 리소스가 CORS 헤더와 함께 제공되는 경우 crossorigin 속성: 리소스 가져오기 요청이 CORS를 사용하도록 설정 모드입니다. 또한 CORS 헤더를 설정하지 않으면 이미지가 로드되지 않습니다.

마찬가지로 fetch() 메서드를 통해 교차 출처 데이터를 가져올 수 있습니다. 서버에서 올바른 URL로 응답하는 한 특별한 처리가 필요하지 않습니다. HTTP(HTTP) 헤더를 포함합니다.

교차 출처 리소스 정책

교차 출처 리소스 정책 (CORP) 원래 Google Cloud Storage 버킷이 다른 출처에서 로드한 것입니다 COEP 컨텍스트에서 CORP는 리소스를 로드할 수 있는 사용자에 대한 소유자 정책

Cross-Origin-Resource-Policy 헤더는 다음 세 가지 값을 사용할 수 있습니다.

Cross-Origin-Resource-Policy: same-site

same-site로 표시된 리소스는 동일한 사이트에서만 로드할 수 있습니다.

Cross-Origin-Resource-Policy: same-origin

same-origin로 표시된 리소스는 동일한 출처에서만 로드할 수 있습니다.

Cross-Origin-Resource-Policy: cross-origin

cross-origin로 표시된 리소스는 모든 웹사이트에서 로드할 수 있습니다. (이 값이 COEP와 함께 CORP 사양 포함)

교차 출처 오프너 정책

교차 출처 오프너 정책 (COOP)를 사용하면 최상위 창이 다른 문서로부터 분리되도록 하기 위해 서로 직접 상호작용할 수 없도록 최상위 수준 창입니다. 예를 들어 COOP가 있는 문서에서 팝업을 열면 window.opener 속성은 null입니다. 또한 .closed 속성은 오프너가 참조하면 true가 반환됩니다.

COOP

Cross-Origin-Opener-Policy 헤더는 다음 세 가지 값을 사용할 수 있습니다.

Cross-Origin-Opener-Policy: same-origin

same-origin로 표시된 문서는 동일한 브라우징 컨텍스트를 공유할 수 있습니다. 명시적으로 same-origin로 표시된 동일한 출처 문서가 있는 그룹

COOP

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

same-origin-allow-popups가 있는 최상위 문서에는 팝업에서 COOP를 설정하지 않거나 COOP unsafe-none을(를) 설정합니다.

COOP

Cross-Origin-Opener-Policy: unsafe-none

기본값은 unsafe-none이며 이 옵션을 통해 문서를 연자의 오프너 자체의 COOP가 same-origin인 경우를 제외하고 탐색 컨텍스트 그룹을 생성할 수 있습니다.

참고: noopener 속성은 오프너 쪽에서만 작동한다는 점을 제외하면 COOP에서 기대하는 것과 비슷한 효과를 발휘합니다. (타사에서 창을 연 경우에는 사용자의 창을 연결 해제할 수 없습니다.) window.open(url, '_blank', 'noopener') 또는 <a target="_blank" rel="noopener"> 등을 실행하여 noopener를 연결할 때 열려 있는 창에서 창을 의도적으로 연결 해제할 수 있습니다. noopener를 COOP로 대체할 수 있지만, COOP를 지원하지 않는 브라우저에서 웹사이트를 보호하려는 경우에는 여전히 유용합니다.

요약

SharedArrayBuffer과 같은 강력한 기능을 계속 이용하려면 performance.measureUserAgentSpecificMemory() 또는 고해상도 타이머도 사용할 수 있습니다. 문서에서 require-corp 값과 함께 COEP를 모두 사용해야 합니다. same-origin의 값을 갖는 COOP 둘 다 없으면 브라우저는 이러한 강력한 기능을 안전하게 사용 설정하기에 충분한 격리가 보장되지는 않습니다. 나 페이지의 현재 상태와 일치하는지 확인하여 self.crossOriginIsolated 드림 는 true를 반환합니다.

구현하는 단계는 웹사이트를 '교차 출처'로 만들기 격리' COOP 및 COEP 사용