무인증 IFrame

다양한 웹 API 기능은 교차 출처 격리를 선택한 사이트에서만 사용할 수 있습니다. 그 예로는 SharedArrayBuffer와 고해상도 타이머 (en-US)가 있습니다. 그 이유는 이러한 기능들이 스펙터 공격에 악용되어 사이드 채널을 통해 피해자의 기밀 정보가 유출되고 공격자가 캡처할 수 있는 위험이 있기 때문입니다.

교차 출처 격리를 선택하려면 same-origin(공격자로부터 출처를 보호) 값을 갖는 Cross-Origin-Opener-Policy (en-US)와 credentialless나 require-corp(원본으로부터 피해자를 보호) 값을 갖는 Cross-Origin-Embedder-Policy를 사용하여 리소스를 제공해야 합니다. 후자는 Cross-Origin-Resource-Policy 또는 교차 출처 리소스 공유를 사용하여 문서에 명시적으로 권한을 부여하지 않은 인증된 교차 출처 리소스를 문서에 로드하지 못하도록 합니다.

교차 출처 격리 채택을 제한하는 핵심적인 문제는 Cross-Origin-Embedder-Policy가 재귀적으로 적용된다는 사실입니다. 즉, Cross-Origin-Embedder-Policy가 설정된 문서에 있는 <iframe>에 로드된 모든 타사 콘텐츠도 Cross-Origin-Embedder-Policy를 배포해야 콘텐츠를 성공적으로 불러올 수 있습니다. 이는 자신의 앱에 타사 콘텐츠(예: 애드 네트워크 콘텐츠)를 삽입하는 개발자가 일반적으로 이를 제어할 수 없기 때문에 문제가 되는데, 지금까지는 타사 콘텐츠 제공 업체가 Cross-Origin-Embedder-Policy를 구현할 때까지 기다리는 것이 유일한 선택지였습니다.

이 문제는 무인증 IFrame으로 해결할 수 있습니다.

<iframe>에 credentialless (en-US) 속성을 적용하거나 이에 상응하는 DOM 속성인 HTMLIFrameElement.credentialless (en-US)를 true로 설정하여 무인증 상태로 만들 수 있습니다.

<iframe
  src="https://en.wikipedia.org/wiki/Spectre_(security_vulnerability)"
  title="Spectre vulnerability Wikipedia page"
  width="960"
  height="600"
  credentialless></iframe>

또는

<iframe width="960" height="600"> </iframe>

const iframeElem = document.querySelector("iframe");

iframeElem.credentialless = true;
iframeElem.title = "Spectre vulnerability Wikipedia page";
iframeElem.src =
  "https://en.wikipedia.org/wiki/Spectre_(security_vulnerability)";

그 결과 무인증 <iframe> 내부의 문서는 새롭고 임시적인 컨텍스트를 사용하여 로드되며, 이러한 컨텍스트는 출처와 관련된 데이터(예: 쿠키와 localStorage)에 접근할 수 없습니다. 무인증 저장소는 최상위 문서 당 한 번씩 설정되는 nonce("한 번 사용된 번호") 값으로 수정된 저장소 키를 통해 개별적으로 분할됩니다. 따라서 하나의 무인증 <iframe>에서 설정된 쿠키는 동일한 최상위 문서 아래에 삽입된 다른 동일 출처의 무인증 <iframe>에서만 접근할 수 있습니다.

nonce는 동일한 최상위 문서의 하위 문서인 모든 무인증 iframe에 공유되지만, 사용자가 탐색하는 각각의 최상위 문서마다 다르며, 사용자가 탐색하던 곳을 벗어나면 저장소에 더 이상 액세스할 수 없습니다. 무인증 IFrame은 여러 페이지에서 저장 공간을 공유하지 않습니다. 위에서 언급한 쿠키로 다시 돌아가자면, 문서를 다시 로드하면 또 다른 컨텍스트에서 무인증 <iframe>이 로드되므로 이전에 설정한 쿠키를 사용할 수 없게 됩니다.

추가로,

• 무인증 iframe에서 열리는 팝업은 rel="noopener" (en-US)가 설정된 상태로 열립니다. 이렇게 하면 무인증 iframe에서 OAuth 팝업 흐름이 사용되는 것을 방지할 수 있습니다.
• 무인증 <iframes>에서 브라우저 자동 완성 또는 비밀번호 관리자 기능을 사용할 수 없습니다.

그 결과, 무인증 <iframe>에 로드된 문서는 사용자의 민감한 정보로 꾸며지지 않은, 사실상 순정 또는 "공개" 버전으로 로드됩니다. 이러한 문서에서 유출될 수 있는 민감한 정보는 없기 때문에, 공격자에게 쓸모 있는 내용은 없고, 해당 IFrame에 대한 교차 출처 삽입 정책 요구 사항은 삭제됩니다.

만약 <iframe>에 credentialless가 설정되어 있다면, 해당 <iframe>에 내장된 자식 <iframe>에도 credentialless 설정이 상속됩니다.

https://anonymous-iframe.glitch.me/ 데모를 사용하여 무인증 IFrame의 작동 방식을 확인할 수 있습니다.

• Cross-Origin-Opener-Policy (en-US)
• Cross-Origin-Embedder-Policy
• Cross-Origin-Resource-Policy
• 교차 출처 리소스 공유
• <iframe> credentialless (en-US) 속성
• HTMLIFrameElement.credentialless (en-US)