AIR의 JavaScript

Flash Player 9 이상, Adobe AIR 1.0 이상

AIR에서는 공통 JavaScript 객체의 일반 비헤이비어가 일부 변경되었습니다. 이러한 변경 사항은 대부분 AIR에서 보안 응용 프로그램을 더 쉽게 작성하기 위한 것입니다. 동시에, 비헤이비어에서의 이러한 차이는 일부 공통 JavaScript 코딩 패턴과 해당 패턴을 사용하는 기존 웹 응용 프로그램이 AIR에서 예상한 대로 실행되지 않을 수도 있다는 것을 나타냅니다. 이러한 유형의 문제를 수정하는 방법에 대한 자세한 내용은 보안 관련 JavaScript 오류 방지 를 참조하십시오.

HTML 샌드박스

AIR에서는 내용의 원본에 따라 격리된 샌드박스에 내용을 저장합니다. 샌드박스 규칙은 Adobe Flash Player에서 구현되는 샌드박스에 대한 규칙뿐 아니라 대부분의 웹 브라우저에서 구현되는 같은 원본의 정책과 일치합니다. 또한, AIR에서는 응용 프로그램 내용을 포함하고 보호하기 위해 새로운 응용 프로그램 샌드박스 유형을 제공합니다. AIR 응용 프로그램을 개발할 때 다루게 되는 샌드박스 유형에 대한 자세한 내용은 보안 샌드박스 를 참조하십시오.

응용 프로그램 샌드박스 내에서 실행되는 HTML 및 JavaScript에서만 런타임 환경 및 AIR API에 액세스할 수 있습니다. 그러나 이와 동시에 다양한 형식의 JavaScript에 대한 동적 평가 및 실행은 보안상의 이유로 응용 프로그램 샌드박스 내에서 대부분 제한됩니다. 이러한 제한은 실제로 응용 프로그램이 서버에서 직접 정보를 로드하는지 여부와 상관없이 적용됩니다. 파일 내용, 붙여넣은 문자열 및 사용자가 직접 입력한 내용도 신뢰할 수 없을 수 있습니다.

페이지에 있는 내용의 원본에 따라 내용이 전달되는 샌드박스가 달라집니다. 응용 프로그램 디렉토리( app: URL 스킴으로 참조되는 설치 디렉토리)에서 로드된 내용만 응용 프로그램 샌드박스에 저장됩니다. 파일 시스템에서 로드된 내용은 local-with-file system 또는 local-trusted 샌드박스에 저장됩니다. 이 샌드박스에서는 로컬 파일 시스템의 내용에 액세스하고 상호 작용할 수는 있지만 원격 내용에는 액세스하거나 상호 작용할 수 없습니다. 네트워크에서 로드된 내용은 원래 도메인에 해당하는 원격 샌드박스에 저장됩니다.

응용 프로그램 페이지에서 원격 샌드박스의 내용과 자유롭게 상호 작용할 수 있게 하려면 페이지를 원격 내용과 동일한 도메인에 매핑할 수 있습니다. 예를 들어 인터넷 서비스에서 맵 데이터를 표시하는 응용 프로그램을 작성하는 경우 서비스의 내용을 로드 및 표시하는 응용 프로그램 페이지를 서비스 도메인에 매핑할 수 있습니다. 원격 샌드박스 및 도메인에 페이지를 매핑하기 위한 특성은 프레임 및 iframe HTML 요소에 추가된 새로운 특성입니다.

비 응용 프로그램 샌드박스의 내용에서 AIR 기능을 안전하게 사용할 수 있게 하려면 부모 샌드박스 브리지를 설정할 수 있습니다. 응용 프로그램 내용에서 안전하게 다른 샌드박스의 내용에 대한 메서드를 호출하고 속성에 액세스할 수 있게 하려면 자식 샌드박스 브리지를 설정할 수 있습니다. 여기서 안전이란 명시적으로 표시되지 않은 객체, 속성 또는 메서드에 대한 참조를 원격 내용에서 실수로 가져올 수 없음을 의미합니다. 간단한 데이터 유형, 함수 및 익명 객체만 브리지를 통해 전달될 수 있습니다. 그러나, 잠재적으로 위험한 함수는 계속 명시적으로 표시되지 않아야 합니다. 예를 들어 원격 내용이 사용자 시스템의 임의의 위치에 있는 파일을 읽고 쓰도록 허용한 인터페이스를 노출한 경우 원격 내용으로 인해 사용자가 상당한 피해를 입을 수 있습니다.

JavaScript eval() 함수

페이지 로드가 완료되면 응용 프로그램 샌드박스 내에서 eval() 함수의 사용이 제한됩니다. JSON 형식 데이터를 안전하게 파싱할 수 있도록 몇 가지 사용 방법이 허용되지만 실행 가능한 명령문을 생성하는 평가에서는 오류가 발생합니다. 서로 다른 샌드박스의 내용에 대한 코드 제한 사항 에서는 eval() 함수의 허용되는 사용 방법에 대해 설명합니다.

함수 생성자

응용 프로그램 샌드박스에서 페이지 로드가 완료되기 전에 함수 생성자를 사용할 수 있습니다. 모든 페이지 load 이벤트 핸들러가 완료된 후에는 새 함수를 만들 수 없습니다.

외부 스크립트 로드

응용 프로그램 샌드박스의 HTML 페이지에서는 스크립트 태그를 사용하여 응용 프로그램 디렉토리 외부에서 JavaScript 파일을 로드할 수 없습니다. 응용 프로그램의 페이지에서 응용 프로그램 디렉토리 외부의 스크립트를 로드하려면 페이지를 비 응용 프로그램 샌드박스에 매핑해야 합니다.

XMLHttpRequest 객체

AIR에서는 응용 프로그램이 데이터를 요청할 때 사용할 수 있는 XMLHttpRequest(XHR) 객체를 제공합니다. 다음 예에서는 간단한 데이터 요청을 보여 줍니다.

xmlhttp = new XMLHttpRequest(); 
xmlhttp.open("GET", "http:/www.example.com/file.data", true); 
xmlhttp.onreadystatechange = function() { 
    if (xmlhttp.readyState == 4) { 
        //do something with data... 
    } 
} 
xmlhttp.send(null); 

브라우저와 달리 AIR에서는 응용 프로그램 샌드박스에서 실행 중인 내용이 모든 도메인의 데이터를 요청할 수 있습니다. JSON 문자열이 포함된 XHR의 결과는 결과에 실행 가능한 코드도 포함된 경우 외에는 데이터 객체로 평가될 수 있습니다. XHR 결과에 실행 가능한 명령문이 있는 경우 오류가 발생하고 평가 시도가 실패합니다.

원격 소스에서 코드가 실수로 삽입되지 않도록 하기 위해 동기식 XHR은 페이지 로드가 완료되기 전에 만들어진 경우 빈 결과를 반환합니다. 비동기 XHR은 항상 페이지가 로드된 후 반환됩니다.

기본적으로 AIR은 비 응용 프로그램 샌드박스에서 크로스 도메인 XMLHttpRequests를 차단합니다. 응용 프로그램 샌드박스의 부모 윈도우에서는 다음과 같이 포함하는 프레임 또는 iframe 요소에서 AIR에 추가된 특성인 allowCrossDomainXHR true 로 설정하여 비 응용 프로그램 샌드박스의 내용을 포함하는 자식 프레임에서 크로스 도메인 요청을 허용할 수 있습니다.

<iframe id="mashup" 
    src="http://www.example.com/map.html" 
    allowCrossDomainXHR="true" 
</iframe>
참고: 편리하다면 AIR URLStream 클래스를 사용하여 데이터를 다운로드할 수도 있습니다.

원격 샌드박스에 매핑된 응용 프로그램 내용을 포함하는 프레임 또는 iframe 요소에서 원격 서버에 XMLHttpRequest를 전달하는 경우 매핑 URL이 XHR에서 사용된 서버 주소에 마스크를 적용하지 않는지 확인합니다. 예를 들어 응용 프로그램 내용을 example.com 도메인의 원격 샌드박스에 매핑하는 다음과 같은 iframe 정의를 생각해 볼 수 있습니다.

<iframe id="mashup" 
    src="http://www.example.com/map.html" 
    documentRoot="app:/sandbox/" 
    sandboxRoot="http://www.example.com/" 
    allowCrossDomainXHR="true" 
</iframe>

sandboxRoot 특성은 www.example.com 주소의 루트 URL을 다시 매핑하므로 모든 요청이 원격 서버가 아닌 응용 프로그램 디렉토리에서 로드됩니다. 요청이 페이지 탐색에서 파생되는지 또는 XMLHttpRequest에서 파생되는지 여부에 상관없이 요청이 다시 매핑됩니다.

원격 서버에 대한 데이터 요청을 실수로 차단하지 않게 하려면 sandboxRoot 를 루트가 아닌 원격 URL의 하위 디렉토리에 매핑합니다. 이 디렉토리는 존재하지 않아도 됩니다. 예를 들어 www.example.com에 대한 요청이 응용 프로그램 디렉토리가 아닌 원격 서버에서 로드되도록 하려면 앞서 설명한 iframe을 다음과 같이 변경합니다.

<iframe id="mashup" 
    src="http://www.example.com/map.html" 
    documentRoot="app:/sandbox/" 
    sandboxRoot="http://www.example.com/air/" 
    allowCrossDomainXHR="true" 
</iframe>

이 경우 air 하위 디렉토리의 내용만 로컬로 로드됩니다.

샌드박스 매핑에 대한 자세한 내용은 HTML 프레임 및 iframe 요소 Adobe AIR의 HTML 보안 을 참조하십시오.

쿠키

AIR 응용 프로그램에서는 원격 샌드박스의 내용(http: 및 https: 소스에서 로드된 내용)에서만 쿠키( document.cookie 속성)를 사용할 수 있습니다. 응용 프로그램 샌드박스에서는 EncryptedLocalStore, SharedObject, FileStream 클래스와 같이, 영구 데이터를 저장하는 데 사용할 수 있는 다른 방법들이 지원됩니다.

Clipboard 객체

WebKit Clipboard API는 copy , cut paste 이벤트에 의해 작동됩니다. 이러한 이벤트에서 전달되는 이벤트 객체의 clipboardData 속성을 통해 클립보드에 액세스할 수 있습니다. 클립보드 데이터를 읽거나 쓰려면 clipboardData 객체의 다음 메서드를 사용합니다.

메서드

설명

clearData(mimeType)

클립보드 데이터를 지웁니다. mimeType 매개 변수를 지울 데이터의 MIME 유형으로 설정합니다.

getData(mimeType)

클립보드 데이터를 가져옵니다. 이 메서드는 paste 이벤트의 핸들러에서만 호출할 수 있습니다. mimeType 매개 변수를 반환할 데이터의 MIME 유형으로 설정합니다.

setData(mimeType, data)

데이터를 클립보드에 복사합니다. mimeType 매개 변수를 데이터의 MIME 유형으로 설정합니다.

응용 프로그램 샌드박스 외부의 JavaScript 코드에서만 이러한 이벤트를 통해 클립보드에 액세스할 수 있습니다. 그러나 응용 프로그램 샌드박스의 내용에서는 AIR Clipboard 클래스를 사용하여 시스템 클립보드에 직접 액세스할 수 있습니다. 예를 들어 다음 명령문을 사용하여 클립보드의 텍스트 서식 데이터를 가져올 수 있습니다.

var clipping = air.Clipboard.generalClipboard.getData("text/plain", 
                                air.ClipboardTransferMode.ORIGINAL_ONLY);

유효한 데이터 MIME 유형은 다음과 같습니다.

MIME 유형

텍스트

"text/plain"

HTML

"text/html"

URL

"text/uri-list"

비트맵

"image/x-vnd.adobe.air.bitmap"

파일 목록

"application/x-vnd.adobe.air.file-list"

중요: 응용 프로그램 샌드박스의 내용에서만 클립보드에 있는 파일 데이터에 액세스할 수 있습니다. 비 응용 프로그램 내용에서 클립보드의 File 객체에 액세스하려고 하면 보안 오류가 발생합니다.

클립보드 사용에 대한 자세한 내용은 복사하여 붙여넣기 JavaScript에서 임시 보드 사용(Apple 개발자 센터) 을 참조하십시오.

드래그 앤 드롭

HTML 내부 및 외부로의 드래그 앤 드롭 동작은 dragstart , drag , dragend , dragenter , dragover , dragleave drop 과 같은 DOM 이벤트를 발생시킵니다. 이러한 이벤트에서 전달되는 이벤트 객체의 dataTransfer 속성을 통해 드래그한 데이터에 액세스할 수 있습니다. dataTransfer 속성은 클립보드 이벤트와 관련된 clipboardData 객체와 동일한 메서드를 제공하는 객체를 참조합니다. 예를 들어 다음 함수를 사용하여 drop 이벤트에서 텍스트 서식 데이터를 가져올 수 있습니다.

function onDrop(dragEvent){ 
    return dragEvent.dataTransfer.getData("text/plain",  
            air.ClipboardTransferMode.ORIGINAL_ONLY); 
}

dataTransfer 객체에는 다음과 같은 중요한 멤버가 있습니다.

멤버

설명

clearData(mimeType)

데이터를 지웁니다. mimeType 매개 변수를 지울 데이터 표현의 MIME 유형으로 설정합니다.

getData(mimeType)

드래그한 데이터를 가져옵니다. 이 메서드는 drop 이벤트의 핸들러에서만 호출할 수 있습니다. mimeType 매개 변수를 가져올 데이터의 MIME 유형으로 설정합니다.

setData(mimeType, data)

드래그할 데이터를 설정합니다. mimeType 매개 변수를 데이터의 MIME 유형으로 설정합니다.

types

현재 dataTransfer 객체에서 사용할 수 있는 모든 데이터 표현의 MIME 유형을 포함하는 문자열의 배열입니다.

effectsAllowed

드래그되는 데이터를 복사, 이동, 연결할 수 있는지 여부 또는 일부 관련 조합을 지정합니다. dragstart 이벤트의 핸들러에서 effectsAllowed 속성을 설정합니다.

dropEffect

허용되는 드롭 효과 중 드래그 대상에서 지원되는 효과를 지정합니다. dragEnter 이벤트의 핸들러에서 dropEffect 속성을 설정합니다. 드래그하는 동안 사용자가 마우스를 놓을 경우 발생할 효과를 표시하기 위해 커서가 변경됩니다. dropEffect 를 지정하지 않은 경우 effectsAllowed 속성 효과가 선택됩니다. 복사 효과가 이동 효과보다 우선하고 이동 효과는 연결 효과보다 우선합니다. 사용자가 키보드를 사용하여 기본 우선 순위를 수정할 수 있습니다.

AIR 응용 프로그램으로 드래그 앤 드롭에 대한 지원을 추가하는 방법에 대한 자세한 내용은 AIR에서 드래그 앤 드롭 JavaScript에서 드래그 앤 드롭 사용(Apple 개발자 센터) 을 참조하십시오.

innerHTML 및 outerHTML 속성

AIR에서는 보안상의 이유로 응용 프로그램 샌드박스에서 실행 중인 내용에 대해 innerHTML outerHTML 속성의 사용을 제한합니다. 페이지 load 이벤트 이전 및 load 이벤트 핸들러 실행 중에는 innerHTML outerHTML 속성을 제약 없이 사용할 수 있습니다. 그러나 페이지가 로드된 후에는 문서에 정적 내용을 추가하는 데에만 innerHTML 또는 outerHTML 속성을 사용할 수 있습니다. innerHTML 또는 outerHTML 에 할당된 문자열에서 실행 코드로 평가되는 모든 명령문은 무시됩니다. 예를 들어 요소 정의에 이벤트 콜백 특성을 포함한 경우 이벤트 리스너가 추가되지 않습니다. 마찬가지로 포함된 <script> 태그는 평가되지 않습니다. 자세한 내용은 Adobe AIR의 HTML 보안 을 참조하십시오.

Document.write() 및 Document.writeln() 메서드

페이지의 load 이벤트 전에는 응용 프로그램 샌드박스에서 write() writeln() 메서드를 제약 없이 사용할 수 있습니다. 그러나 페이지가 로드된 후에는 이러한 메서드를 호출해도 페이지가 지워지거나 새 페이지가 만들어지지 않습니다. 비 응용 프로그램 샌드박스에서는 대부분의 웹 브라우저에서처럼 페이지 로드가 완료된 후 document.write() 또는 writeln() 을 호출하면 현재 페이지가 지워지고 비어 있는 새 페이지가 열립니다.

Document.designMode 속성

문서의 모든 요소를 편집할 수 있도록 만들려면 document.designMode 속성을 on 값으로 설정합니다. 내장 편집기에서는 텍스트 편집, 복사, 붙여넣기 및 드래그 앤 드롭이 지원됩니다. designMode on 으로 설정하는 것은 body 요소의 contentEditable 속성을 true 로 설정하는 것과 같습니다. 대부분의 HTML 요소에서 contentEditable 속성을 사용하여 편집할 수 있는 문서 섹션을 정의할 수 있습니다. 자세한 내용은 HTML contentEditable 특성 을 참조하십시오.

unload 이벤트(body 및 frameset 객체)

윈도우(응용 프로그램의 기본 윈도우 포함)의 최상위 frameset 또는 body 태그에서는 닫히는 윈도우 또는 응용 프로그램에 unload 이벤트를 사용하여 응답하지 마십시오. 대신 NativeApplication 객체의 exiting 이벤트를 사용하여 응용 프로그램이 닫히는 시간을 감지합니다. 또는 NativeWindow 객체의 closing 이벤트를 사용하여 윈도우가 닫히는 시간을 감지합니다. 예를 들어 다음 JavaScript 코드에서는 사용자가 응용 프로그램을 닫을 때 메시지( "Goodbye." )를 표시합니다.

var app = air.NativeApplication.nativeApplication; 
app.addEventListener(air.Event.EXITING, closeHandler); 
function closeHandler(event) 
{ 
    alert("Goodbye."); 
}

그러나 스크립트는 프레임, iframe 또는 최상위 윈도우 내용의 탐색으로 발생한 unload 이벤트에 성공적으로 응답 할 수 있습니다 .

참고: 이러한 제한 사항은 이후 버전의 Adobe AIR에서 제거됩니다.

JavaScript Window 객체

Window 객체는 JavaScript 실행 컨텍스트에서 전역 객체로 유지됩니다. 응용 프로그램 샌드박스에서 AIR은 AIR의 내장 클래스 및 중요한 호스트 객체에 액세스하는 데 사용할 수 있는 새 속성을 JavaScript Window 객체에 추가합니다. 또한 일부 메서드 및 속성은 응용 프로그램 샌드박스 내에 있는지 여부에 따라 다르게 동작합니다.

Window.runtime 속성
runtime 속성을 사용하면 응용 프로그램 샌드박스 내에서 내장 런타임 클래스를 인스턴스화하고 사용할 수 있습니다. 이러한 클래스에는 AIR 및 Flash Player API가 포함되지만 Flex 프레임워크 등은 포함되지 않습니다. 예를 들어 다음 명령문은 AIR File 객체를 만듭니다.
var preferencesFile = new window.runtime.flash.filesystem.File();

AIR SDK에 제공되는 AIRAliases.js 파일에는 이러한 참조를 줄이는 데 사용할 수 있는 별칭 정의가 포함되어 있습니다. 예를 들어 AIRAliases.js 를 페이지로 가져오면 다음 명령문을 사용하여 File 객체를 만들 수 있습니다.

var preferencesFile = new air.File();

window.runtime 속성은 응용 프로그램 샌드박스 내의 내용 및 프레임 또는 iframe이 있는 페이지의 부모 문서에 대해서만 정의됩니다.

AIRAliases.js 파일 사용 을 참조하십시오.

Window.nativeWindow 속성
nativeWindow 속성은 기본 window 객체에 대한 참조를 제공합니다. 이 속성을 사용하면 화면 위치, 크기 및 가시성과 같은 윈도우 함수 및 속성을 스크립팅하고 닫기, 크기 조정 및 이동과 같은 윈도우 이벤트를 처리할 수 있습니다. 예를 들어 다음 명령문은 윈도우를 닫습니다.
window.nativeWindow.close();
참고: NativeWindow 객체에서 제공하는 윈도우 제어 기능은 JavaScript Window 객체에서 제공하는 기능과 겹칩니다. 이러한 경우 가장 간편한 메서드를 사용할 수 있습니다.

window.nativeWindow 속성은 응용 프로그램 샌드박스 내의 내용 및 프레임 또는 iframe이 있는 페이지의 부모 문서에 대해서만 정의됩니다.

Window.htmlLoader 속성
htmlLoader 속성은 HTML 내용을 포함하는 AIR HTMLLoader 객체에 대한 참조를 제공합니다. 이 속성을 사용하면 HTML 환경의 모양과 비헤이비어를 스크립팅할 수 있습니다. 예를 들어 htmlLoader.paintsDefaultBackground 속성을 사용하여 컨트롤을 기본 흰색 배경으로 칠할지 여부를 결정할 수 있습니다.
window.htmlLoader.paintsDefaultBackground = false;
참고: HTMLLoader 객체 자체에는 포함된 HTML 내용의 JavaScript Window 객체를 참조하는 window 속성이 있습니다. 이 속성을 사용하면 포함하는 HTMLLoader에 대한 참조를 통해 JavaScript 환경에 액세스할 수 있습니다.

window.htmlLoader 속성은 응용 프로그램 샌드박스 내의 내용 및 프레임 또는 iframe이 있는 페이지의 부모 문서에 대해서만 정의됩니다.

Window.parentSandboxBridge 및 Window.childSandboxBridge 속성
parentSandboxBridge childSandboxBridge 속성을 사용하면 부모 및 자식 프레임 간의 인터페이스를 정의할 수 있습니다. 자세한 내용은 서로 다른 보안 샌드박스의 내용 크로스 스크립팅 을 참조하십시오.

Window.setTimeout() 및 Window.setInterval() 함수
AIR에서는 보안상의 이유로 응용 프로그램 샌드박스 내에서 setTimeout() setInterval() 함수의 사용을 제한합니다. setTimeout() 또는 setInterval() 을 호출할 때 문자열로 실행할 코드를 정의할 수 없습니다. 함수 참조를 사용해야 합니다. 자세한 내용은 setTimeout() 및 setInterval() 을 참조하십시오.

Window.open() 함수
비 응용 프로그램 샌드박스에서 실행 중인 코드에서 open() 메서드를 호출하는 경우에는 마우스 클릭이나 키 누르기와 같은 사용자 상호 작용의 결과로 호출될 때만 윈도우를 엽니다. 또한 원격 내용에서 여는 윈도우가 응용 프로그램에서 여는 윈도우로 가장하지 못하도록 응용 프로그램 제목 앞에 윈도우 제목을 붙입니다. 자세한 내용은 JavaScript window.open() 메서드 호출에 대한 제한 사항 을 참조하십시오.

air.NativeApplication 객체

NativeApplication 객체는 응용 프로그램 상태에 대한 정보를 제공하고 여러 중요한 응용 프로그램 수준의 이벤트를 전달하여 응용 프로그램 비헤이비어를 제어하는 유용한 함수를 제공합니다. NativeApplication 객체의 단일 인스턴스가 자동으로 생성되며 클래스 정의 NativeApplication.nativeApplication 속성을 통해 이 인스턴스에 액세스할 수 있습니다.

JavaScript 코드에서 객체에 액세스하려면 다음을 사용할 수 있습니다.

var app = window.runtime.flash.desktop.NativeApplication.nativeApplication;

또는 AIRAliases.js 스크립트를 가져온 경우 다음과 같은 짧은 형식을 사용할 수 있습니다.

var app = air.NativeApplication.nativeApplication;

NativeApplication 객체는 응용 프로그램 샌드박스 내에서만 액세스할 수 있습니다. NativeApplication 객체에 대한 자세한 내용은 AIR 런타임 및 운영 체제 정보 작업 을 참조하십시오.

JavaScript URL 스킴

JavaScript URL 스킴 내에 정의된 코드 실행(예: href="javascript:alert('Test')" )은 응용 프로그램 샌드박스 내에서 차단됩니다. 오류는 발생하지 않습니다.