HTML в AIR

Adobe AIR 1.0 и более новых версий

AIR и WebKit задают несколько нестандартных элементов и атрибутов HTML, включая:

Элементы frame и iframe в HTML

Обработчики событий элементов HTML

Элементы frame и iframe в HTML

AIR добавляет новые атрибуты в элементы frame и iframe содержимого в изолированной программной среде приложения:

Атрибут sandboxRoot
Атрибут sandboxRoot задает альтернативный домен происхождения файла в атрибуте фрейма src (вне приложения). Файл загружается в изолированную программную среду вне приложения, соответствующую определенному домену. Содержимое файла и содержимое, загруженное с заданного домена, поддерживают перекрестное выполнение сценариев.
Важная информация. Если в качестве значения sandboxRoot указан основной URL-адрес домена, все запросы содержимого с этого домена загружаются из каталога приложения, а не с удаленного сервера (вне зависимости от того, как формируется запрос: в результате навигации пользователя, интерфейсом XMLHttpRequest или иным способом загрузки содержимого).

атрибут documentRoot
Атрибут documentRoot задает локальный каталог, из которого загружаются URL-адреса, ведущие к файлам в расположении, указанном в sandboxRoot.

При обработке URL-адресов в атрибуте фрейма src или в содержимом, загружаемом во фрейм, часть URL, совпадающая со значением sandboxRoot, замещается значением documentRoot. Следовательно, в следующем теге фрейма:

<iframe        src="http://www.example.com/air/child.html"  
            documentRoot="app:/sandbox/" 
            sandboxRoot="http://www.example.com/air/"/>

child.html загружается из подкаталога sandbox установочной папки приложения. При обработке относительных URL-адресов в child.html за основу берется каталог sandbox. Обратите внимание, что файлы на удаленном сервере www.example.com/air недоступны из фрейма, так как AIR будет пытаться загрузить их из каталога app:/sandbox/.

Атрибут allowCrossDomainXHR
Чтобы содержимое фрейма могло отправлять запросы XMLHttpRequest любому удаленному домену, включите в открывающий фрейм код allowCrossDomainXHR="allowCrossDomainXHR". По умолчанию содержимое вне приложения может отправлять такие запросы только в пределах собственного домена. С междоменным API XHR связаны серьезные риски безопасности. Код на этой странице может обмениваться данными с любым доменом. Если на страницу каким-то образом проникло вредоносное содержимое, то опасность угрожает всем данным, которые доступны коду в текущей изолированной программной среде. Междоменный API XHR следует разрешать только тем страницам, которые вы лично создаете и контролируете, и только если загрузка данных с другого домена действительно необходима. Также для предотвращения внедрения вредоносного кода и иных атак рекомендуется проверять все внешние данные, загружаемые на страницу.
Важная информация. Если атрибут allowCrossDomainXHR включен в элемент frame или iframe, междоменный API XHR разрешен (кроме случаев, когда назначенное значение равно 0 или начинается с буквы «f» или «n»). Например, если allowCrossDomainXHR равно "deny", междоменный API XHR будет разрешен. Чтобы отключить междоменное выполнение сценариев, удалите атрибут из объявления элемента.

атрибут ondominitialize
Задает обработчик события dominitialize для фрейма. Это событие является характерным для среды AIR. Оно выполняется при создании объектов окна и документа фрейма, но до разбора какого-либо кода и до создания элементов документа.

Фрейм отправляет событие dominitialize на достаточно раннем этапе загрузки, чтобы любой код дочерней страницы мог ссылаться на объекты, переменные и функции, добавленные в дочерний документ обработчиком dominitialize. Родительская страница должна находиться в той же изолированной программной среде, что и дочерняя, чтобы напрямую добавлять объекты в дочернем документе или обращаться к ним. Тем не менее родитель в изолированной программной среде приложения может установить мост для обращения к содержимому в изолированной программной среде вне приложения.

В примерах ниже показано, как использовать тег iframe в AIR:

Документ child.html помещается в удаленную изолированную программную среду без сопоставления с реальным доменом или удаленным сервером:

<iframe        src="http://localhost/air/child.html"  
            documentRoot="app:/sandbox/" 
            sandboxRoot="http://localhost/air/"/>

Документ child.html помещается в удаленную изолированную программную среду с разрешением запросов XMLHttpRequest к домену www.example.com:

<iframe        src="http://www.example.com/air/child.html"  
            documentRoot="app:/sandbox/" 
            sandboxRoot="http://www.example.com/air/"/>

Документ child.html помещается в удаленную изолированную программную среду с разрешением запросов XMLHttpRequest к любому удаленному домену:

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

Документ child.html помещается в изолированную программную среду с доступом к локальной файловой системе:

<iframe             src="file:///templates/child.html"  
            documentRoot="app:/sandbox/" 
            sandboxRoot="app-storage:/templates/"/>

Документ child.html помещается в удаленную изолированную программную среду с помощью события dominitialize, которое устанавливает мост:

<html> 
<head> 
<script> 
var bridgeInterface = {}; 
bridgeInterface.testProperty = "Bridge engaged"; 
function engageBridge(){ 
    document.getElementById("sandbox").parentSandboxBridge = bridgeInterface; 
} 
</script> 
</head> 
<body> 
<iframe id="sandbox" 
            src="http://www.example.com/air/child.html"  
            documentRoot="app:/" 
            sandboxRoot="http://www.example.com/air/" 
            ondominitialize="engageBridge()"/> 
</body> 
</html>

В следующем документе child.html показано, как содержимое дочерней изолированной программной среды может получать доступ к мосту родительской:

<html> 
    <head> 
        <script> 
            document.write(window.parentSandboxBridge.testProperty); 
        </script>   
    </head>   
    <body></body> 
</html>

Дополнительные сведения см. в разделах «Перекрестное выполнение сценариев в содержимом из различных изолированных программных сред безопасности» и «Безопасность HTML в Adobe AIR».

Обработчики событий элементов HTML

Объекты модели DOM в AIR и WebKit отправляют некоторые события, которых нет в стандартной модели событий DOM. В таблице ниже перечислены связанные атрибуты событий, которые могут использоваться для указания обработчиков этих событий:

Имя атрибута обратного вызова

Описание

oncontextmenu

Вызывается при активации контекстного меню с помощью правой кнопки мыши или щелчка по выделенному тексту с удержанием командной клавиши.

oncopy

Вызывается при копировании выделенного фрагмента элемента.

oncut

Вызывается при вырезании выделенного фрагмента элемента.

ondominitialize

Вызывается при создании модели DOM документа, загружаемого во фрейм или встроенный фрейм, но до создания элементов DOM или разбора кода сценариев.

ondrag

Вызывается при перетаскивании элемента.

ondragend

Вызывается при отпускании после перетаскивания.

ondragenter

Вызывается, когда курсор при перетаскивании входит в границы элемента.

ondragleave

Вызывается, когда курсор при перетаскивании выходит за границы элемента.

ondragover

Вызывается непрерывно, пока курсор при перетаскивании находится в границах элемента.

ondragstart

Вызывается при начале жеста перетаскивания.

ondrop

Вызывается, когда жест перетаскивания прекращается на элементе.

onerror

Вызывается, если при загрузке элемента возникает ошибка.

oninput

Вызывается, когда в элемент form вводится текст.

onpaste

Вызывается, когда в элемент вставляются данные.

onscroll

Вызывается при прокрутке содержимого в элементе, поддерживающем возможность прокрутки.

onselectstart

Вызывается, когда начинается выделение.

Атрибут contentEditable в HTML

Атрибут contentEditable может быть добавлен к любому HTML-элементу. После этого пользователи смогут изменять содержимое элемента. В примере ниже в HTML-коде указано, что весь документ является редактируемым, кроме первого элемента p:

<html> 
<head/> 
<body contentEditable="true"> 
    <h1>de Finibus Bonorum et Malorum</h1> 
    <p contentEditable="false">Sed ut perspiciatis unde omnis iste natus error.</p> 
    <p>At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis.</p> 
</body> 
</html>
Примечание. Если свойство document.designMode имеет значение on, то все элементы документа можно редактировать вне зависимости от того, задано ли свойство contentEditable для отдельного элемента. Однако если задать для свойства designMode значение off, то элементы, для которых contentEditable равно true, по-прежнему будут редактируемыми. Дополнительные сведения см. в разделе «Свойство Document.designMode».

Класс Data: URL-адреса

AIR поддерживает URL-адреса класса data: для следующих элементов:

  • img

  • input type="image"

  • Правила CSS, допускающие использование изображений (например, background-image)

URL-адреса класса Data позволяют вставлять двоичные данные изображения непосредственно в документ CSS или HTML в качестве строки, закодированной в формате base64. В следующем примере URL-адрес класса data: используется в качестве повторяющегося фона:

<html> 
<head> 
<style> 
body { 
background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAMAAABHPGVmAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAAZQTFRF%2F6cA%2F%2F%2F%2Fgxp3lwAAAAJ0Uk5T%2FwDltzBKAAABF0lEQVR42uzZQQ7CMAxE0e%2F7X5oNCyRocWzPiJbMBZ6qpIljE%2BnwklgKG7kwUjc2IkIaxkY0CPdEsCCasws6ShXBgmBBmEagpXQQLAgWBAuSY2gaKaWPYEGwIEwg0FRmECwIFoQeQjJlhJWUEFazjFDJCkI5WYRWMgjtfEGYyQnCXD4jTCdm1zmngFpBFznwVNi5RPSbwbWnpYr%2BBHi%2FtCTfgPLEPL7jBctAKBRptXJ8M%2BprIuZKu%2BUKcg4YK1PLz7kx4bSqHyPaT4d%2B28OCJJiRBo4FCQsSA0bziT3XubMgYUG6fc5fatmGBQkL0hoJ1IaZMiQsSFiQ8vRscTjlQOI2iHZwtpHuf%2BJAYiOiJSkj8Z%2FIQ4ABANvXGLd3%2BZMrAAAAAElFTkSuQmCC'); 
background-repeat:repeat; 
} 
</style> 
</head> 
<body> 
</body> 
</html>

При использовании URL-адресов класса data: помните, что дополнительный пробел играет важную роль. Например, строка данных должна вводиться как одна неразрывная строка. В противном случае разрывы строки будут считаться частью данных и декодирование изображения будет невозможно.