Создание первого HTML-приложения AIR с помощью комплекта AIR SDK

Чтобы быстро на практике продемонстрировать как работает Adobe® AIR®, используйте эти инструкции по созданию и упаковке простейшего HTML-приложения AIR «Hello World».

Для начала необходимо установить среду выполнения и настроить AIR SDK. Используются инструменты AIR Debug Launcher (ADL) и AIR Developer Tool (ADT), описанные в данном руководстве. ADL и ADT — это служебные программы, запускаемые из командной строки, которые можно найти в каталоге bin в пакете AIR SDK (см. раздел « Установка AIR SDK »). Предполагается, что читатель данного руководства уже знаком с тем, как запускать программы из командной строки и знает как настроить необходимые переменные пути в операционной системе.

Примечание. Если используется продукт Adobe® Dreamweaver®, ознакомьтесь с разделом « Создание первого HTML-приложения AIR с помощью Dreamweaver ».
Примечание. Приложения AIR на базе HTML могут быть разработаны только для профилей desktop и extendedDesktop. Мобильный профиль не поддерживается.

Создание файлов проекта

В каждом HTML-приложении AIR содержатся следующие два файла: файл дескриптора приложения, определяющий метаданные приложения, и страница HTML верхнего уровня. В дополнение к этим обязательным файлам данный проект содержит файл с кодом JavaScript, AIRAliases.js , который определяет подходящие псевдонимы-переменные для классов прикладного интерфейса программирования AIR.

  1. Создайте каталог с именем HelloWorld , в котором будут содержаться файлы проекта.

  2. Создайте файл XML с именем HelloWorld-app.xml .

  3. Создайте файл HTML с именем HelloWorld.html .

  4. Скопируйте файл AIRAliases.js из папки frameworks в AIR SDK в каталог проекта.

Создание файла дескриптора приложения AIR

Чтобы приступить к разработке приложения AIR, создайте XML-файл дескриптора приложения со следующей структурой: 

<application xmlns="..."> 
    <id>…</id> 
    <versionNumber>…</versionNumber> 
    <filename>…</filename> 
    <initialWindow> 
        <content>…</content> 
        <visible>…</visible> 
        <width>…</width> 
        <height>…</height> 
    </initialWindow> 
</application>

  1. Откройте файл HelloWorld-app.xml для редактирования.

  2. Добавьте корневой элемент <application> , включая атрибут пространства имен AIR:

    <application xmlns="http://ns.adobe.com/air/application/2.7"> Последний сегмент пространства имен (2.7) указывает версию среды выполнения, которая требуется для приложения.

  3. Добавьте элемент <id> :

    <id>examples.html.HelloWorld</id> Идентификатор приложения однозначно идентифицирует приложение в сочетании с идентификатором издателя (который AIR извлекает из сертификата, используемого для подписи пакета приложения). Идентификатор приложения используется для установки, обращения к частному каталогу хранилища файловой системы приложения, доступа к частному зашифрованному хранилищу и взаимодействия между приложениями.

  4. Добавьте элемент <versionNumber> :

    <versionNumber>0.1</versionNumber> Помогает пользователям определить, какую версию приложения они устанавливают.

    Примечание. Если используется AIR 2 или более ранней версии, необходимо использовать элемент <version> вместо элемента <versionNumber> .

  5. Добавьте элемент <filename> :

    <filename>HelloWorld</filename> Имя, используемое для выполняемого файла приложения, каталога установки и других ссылок на приложение в операционной системе.

  6. Добавьте элемент <initialWindow> , содержащий следующие дочерние элементы, чтобы указать свойства исходного окна приложения:

    <content>HelloWorld.html</content> Указывает корневой HTML-файл приложения AIR для загрузки.

    <visible>true</visible> Сразу делает окно видимым.

    <width>400</width> Задает ширину окна (в пикселах).

    <height>200</height> Задает высоту окна.

  7. Сохраните файл. Завершенный файл дескриптора приложения должен выглядеть следующим образом. 

    <?xml version="1.0" encoding="UTF-8"?> 
<application xmlns="http://ns.adobe.com/air/application/2.7"> 
    <id>examples.html.HelloWorld</id> 
    <versionNumber>0.1</versionNumber> 
    <filename>HelloWorld</filename> 
    <initialWindow> 
        <content>HelloWorld.html</content> 
        <visible>true</visible> 
        <width>400</width> 
        <height>200</height> 
    </initialWindow> 
</application>

В этом примере устанавливается всего несколько возможных свойств приложения. Полный набор свойств приложения, которые позволяют указывать такие аспекты как хром окна, размер окна, прозрачность, каталог установки по умолчанию, связанные типы файлов и значки приложения, см. в разделе « Файлы дескриптора приложения AIR ».

Создание HTML-страницы приложения

Теперь необходимо создать простую HTML-страницу, которая будет выполнять роль основного файла приложения AIR.

  1. Откройте файл HelloWorld.html для редактирования. Добавьте следующий код HTML: 

    <html> 
<head> 
    <title>Hello World</title> 
</head> 
<body onLoad="appLoad()"> 
    <h1>Hello World</h1> 
</body> 
</html>

  2. В разделе <head> HTML, импортируйте файл AIRAliases.js : 

    <script src="AIRAliases.js" type="text/javascript"></script>

    AIR определяет свойство с именем runtime для объекта окна HTML. Свойство runtime обеспечивает доступ к встроенным классам AIR, используя полностью уточненное имя пакета для класса. Например, чтобы создать объект файла AIR, можно добавить следующую инструкцию в JavaScript: 

    var textFile = new runtime.flash.filesystem.File("app:/textfile.txt");

    Файл AIRAliases.js определяет подходящие псевдонимы для наиболее полезных прикладных программных интерфейсов AIR. Используя AIRAliases.js , можно укоротить ссылку на класс File следующим образом: 

    var textFile = new air.File("app:/textfile.txt");

  3. Ниже приведен тег скрипта AIRAliases, добавьте другой тег скрипта, содержащий функцию JavaScript для обработки события onLoad : 

    <script type="text/javascript"> 
function appLoad(){ 
    air.trace("Hello World"); 
} 
</script>

    Функция appLoad() просто вызывает функцию air.trace() . При запуске приложения с помощью ADL сообщение трассировки вводится на консоль управления. Сообщения трассировки могут быть очень полезны для отладки.

  4. Сохраните файл.

Файл HelloWorld.html должен выглядеть следующим образом: 

<html> 
<head> 
    <title>Hello World</title> 
    <script type="text/javascript" src="AIRAliases.js"></script> 
    <script type="text/javascript"> 
        function appLoad(){ 
            air.trace("Hello World"); 
        }  
    </script> 
</head> 
<body onLoad="appLoad()"> 
    <h1>Hello World</h1> 
</body> 
</html>

Проверка приложения

Чтобы запустить и проверить приложение из командной строки, используйте утилиту AIR Debug Launcher (ADL). Исполняемый файл ADL можно найти в каталоге bin пакета AIR SDK. Если настройка AIR SDK еще не выполнена, см. раздел « Установка AIR SDK ».

  1. Откройте консоль управления или оболочку ОС. Перейдите в каталог, который создан для этого проекта.

  2. Выполните следующую команду: 

    adl HelloWorld-app.xml

    Открывается окно AIR, в котором отображается приложение. Также в окне консоли отображается сообщение, полученное в результате вызова air.trace() .

    Дополнительные сведения см. в разделе « Файлы дескриптора приложения AIR ».

Создание файла установки AIR

Если приложение успешно запущено, можно использовать утилиту ADT, чтобы упаковать приложение в файл установки AIR. Файл установки AIR — это файл архива, в котором содержаться все файлы приложения, которые можно передавать другим пользователям. Перед установкой такого упакованного файла AIR необходимо установить Adobe AIR.

Чтобы обеспечить защиту приложения, все файлы установки AIR должны содержать цифровую подпись. С помощью ADT или другого инструмента генерации сертификатов можно создать простой, самозаверяющий сертификат, используемый в целях разработки. Также можно приобрести коммерческий сертификат для подписывания кодов, выпущенный специальными органами сертификации, например компаниями VeriSign или Thawte. Если пользователь устанавливает файл AIR с самозаверяющим сертификатом, то в ходе процесса установки показывается «неизвестный» издатель. Это объясняется тем, что самозаверяющие сертификаты гарантируют лишь то, что файл AIR не изменялся с момента своего создания. Ничто не сможет помешать злоумышленнику сделать файл AIR с самозаверяющим сертификатом и представить его как ваше приложение. Поэтому в выпускаемых для широкого использования файлах AIR рекомендуется использовать обеспечивающие возможность проверки коммерческие сертификаты. Краткие сведения о проблемах системы защиты AIR см. в разделе Система защиты AIR (для разработчиков ActionScript) или Система защиты AIR (для разработчиков HTML).

Создание самозаверяющих подписывающих сертификатов и пары ключей

Из командной строки выполните следующую команду (выполняемый файл ADT находится в каталоге bin пакета AIR SDK): 
adt -certificate -cn SelfSigned 1024-RSA sampleCert.pfx samplePassword

ADT создает файл хранения ключа с именем sampleCert.pfx , содержащий сертификат и связанный личный ключ.

В этом примере используется минимальный набор атрибутов, которые могут быть установлены для сертификата. Ключ должен иметь тип 1024-RSA или 2048-RSA (см. раздел « Подписание приложений AIR »).

Создание файла установки AIR

Из командной строки выполните следующую команду (вводится одной строкой): 
adt -package -storetype pkcs12 -keystore sampleCert.pfx HelloWorld.air 
HelloWorld-app.xml HelloWorld.html AIRAliases.js

Будет выдано предложение ввести пароль для файла ключей.

Аргумент HelloWorld.air — это файл AIR, создаваемый ADT. HelloWorld-app.xml — это файл дескриптора приложения. Последующими аргументами являются файлы, используемые приложением. В этом примере используется только два файла, но можно включить в проект любое число файлов и каталогов. ADT проверяет, что главный файл с содержимым HelloWorld.html включен в пакет. Однако если вы забудете включить файл AIRAliases.js, приложение не будет работать.

После создания пакета AIR можно установить и выполнить приложение, дважды щелкнув этот упакованный файл. Также можно ввести имя файла AIR, используя команду в оболочке ОС или консоль управления.

Следующие шаги

В приложении AIR коды HTML и JavaScript обычно выполняются так же, как и в стандартном веб-обозревателе. (Действительно, AIR использует тот же механизм визуализации WebKit, который применяется веб-обозревателем Safari.) Однако существует несколько важных отличий, которые необходимо учитывать при разработке HTML-приложения в AIR. Дополнительные сведения об этих различиях, а также другие полезные сведения см. в разделе Программирование HTML и JavaScript .