HTML в AIRAdobe AIR 1.0 и более новых версий
Элементы 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: для следующих элементов:
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: помните, что дополнительный пробел играет важную роль. Например, строка данных должна вводиться как одна неразрывная строка. В противном случае разрывы строки будут считаться частью данных и декодирование изображения будет невозможно.
|
|