코딩의 시작, TCP School

◀ 이전 다음 ▶

<iframe> 태그의 sandbox 속성

HTML <iframe> 태그 ⇒

정의 및 특징

sandbox 속성의 값은 모든 제한 사항을 적용하기 위해 비어놓거나(sandbox), 특정 제한 사항만을 해제하기 위해 미리 정의해 놓은 값들을 공백 문자(space)로 결합하여 사용할 수도 있습니다.

문법

속성값

속성값		설명
(비어 놓음)		모든 제한 사항(restrictions)을 적용함.
allow-forms		리소스(resource)가 폼 데이터를 제출할 수 있도록 허용함.
allow-modals		리소스가 모달 윈도우(modal window)를 열 수 있도록 허용함.
allow-orientation-lock		리소스가 화면 방향 전환을 잠글 수 있도록 허용함.
allow-pointer-lock		리소스가 Pointer Lock API를 사용할 수 있도록 허용함.
allow-popups		window.open()이나 target=“_blank”, showModalDialog() 등의 팝업(popup)을 허용함.
allow-popups-to-escape-sandbox		모든 제한 사항이 적용된 문서(sandboxed document)에서 새로운 창(window)을 열 때 제한 사항을 상속받지 않은 창을 열 수 있도록 허용함.
allow-presentation		리소스가 프레젠테이션 세션(presentation section)을 시작할 수 있도록 허용함.
allow-same-origin		리소스가 same-origin policy를 통과된 것처럼 취급될 수 있도록 허용함.
allow-scripts		리소스가 스크립트를 실행할 수 있도록 허용하지만, 팝업창은 생성하지 못함.
allow-storage-access-by-user-activation		리소스가 Storage Access API를 사용하여 상위 스토리지 기능에 접근 요청을 할 수 있도록 허용함.
allow-top-navigation		리소스가 최상위 브라우징 컨텍스트(_top)를 탐색할 수 있도록 허용함.
allow-top-navigation-by-user-activation		리소스가 사용자의 요청이 있을 때만 최상위 브라우징 컨텍스트(_top)를 탐색할 수 있도록 허용함.

예제 1

<iframe src="/examples/media/iframe_sandbox.html" sandbox>
    <p>현재 사용 중인 브라우저는 iframe 요소를 지원하지 않습니다!</p>
</iframe>

<iframe src="/examples/media/iframe_sandbox.html">
    <p>현재 사용 중인 브라우저는 iframe 요소를 지원하지 않습니다!</p>
</iframe>

코딩연습 ▶

예제 2

<iframe src="/examples/media/iframe_sandbox_form.html" sandbox="">
    <p>현재 사용 중인 브라우저는 iframe 요소를 지원하지 않습니다!</p>
</iframe>

<iframe src="/examples/media/iframe_sandbox_form.html" sandbox="allow-forms">
    <p>현재 사용 중인 브라우저는 iframe 요소를 지원하지 않습니다!</p>
</iframe>

코딩연습 ▶