HTML <iframe> sandbox 속성

HTML <iframe> 태그

정의와 사용법

sandbox 속성이 iframe 내 콘텐츠에 추가 제한을 활성화했습니다.

당 sandbox 속성이 존재할 때, 그것은:

  • 콘텐츠를 유일한 출처로 간주합니다
  • 폼 제출을 차단합니다
  • 스크립트 실행을 차단합니다
  • API를 비활성화합니다
  • 링크가 다른 브라우저 컨텍스트로 이동하지 못하게 합니다
  • 콘텐츠가 플러그인을 사용하지 못하게 합니다(예: <embed>, <object>, <applet> 또는 다른 방식으로)
  • 콘텐츠가 최상위 브라우저 컨텍스트를 탐색하지 못하게 합니다
  • 자동으로 발생하는 기능을 차단합니다(예: 자동 재생 비디오나 자동으로 포커스하는 폼 컨트롤)

sandbox 속성 값은 비어 있을 수 있으며(모든 제한을 적용합니다)，또는 특정 제한을 제거할 목적으로 공백으로 구분된 사전 정의된 값의 목록일 수 있습니다.

예제

예제 1

추가 제한을 가진 <iframe>:

<iframe src="demo_iframe_sandbox.htm" sandbox></iframe>

직접 시험해 보세요

예제 2

폼 제출을 허용하는 <iframe> 샌드박스:

<iframe src="demo_iframe_sandbox_form.htm" sandbox="allow-forms"></iframe>

직접 시험해 보세요

예제 3

스크립트 실행을 허용하는 <iframe> 샌드박스:

<iframe src="demo_iframe_sandbox_origin.htm" sandbox="allow-scripts"></iframe>

직접 시험해 보세요

문법

<iframe sandbox="value">

속성 값

가치 설명
""（가치 없음） 이하의 모든 제한을 적용합니다.
allow-forms 폼 제출을 허용합니다.
allow-modals 모달 창을 열 수 있게 허용합니다.
allow-orientation-lock 스크린 방향을 잠그게 허용합니다.
allow-pointer-lock Pointer Lock API 사용을 허용합니다.
allow-popups 팝업을 허용합니다.
allow-popups-to-escape-sandbox 샷다운을 상속하지 않고 새 창을 엽니다.
allow-presentation 프레젠테이션 세션을 시작할 수 있습니다.
allow-same-origin iframe 내용이 포함된 문서와 동일한 원본으로 간주될 수 있습니다.
allow-scripts 스크립트 실행을 허용합니다.
allow-top-navigation iframe 내용이 최상위 브라우저 컨텍스트를 탐색할 수 있습니다.
allow-top-navigation-by-user-activation iframe 내용이 최상위 브라우저 컨텍스트를 탐색할 수 있음, 하지만 사용자가 시작했을 때만 가능합니다.

브라우저 지원

표에서는 해당 속성을 최초로 완전히 지원하는 브라우저 버전이 나와 있습니다.

크롬 에지 파이어폭스 사파리 오페라
크롬 에지 파이어폭스 사파리 오페라
4.0 10.0 17.0 5.0 15.0

HTML <iframe> 태그