Большинство предприятий сегодня планируют или уже поставляют многофункциональные интернет-приложения. Полное обновление страниц — это история. Сегодня клиенты хотят иметь быстрые, интерактивные и многофункциональные веб-приложения, которые выглядят и выглядят как настольные приложения.
В то время как богатые интернет-приложения явно являются будущим, технологии или стек технологий, которые можно использовать для них, не всегда понятны.
Многие ИТ-менеджеры сталкиваются с вопросом: «Какую технологию пользовательского интерфейса использовать?». Другой, не менее важный вопрос: «Какие бэкэнд-технологии использовать?» Выбор интерфейса пользователя в изобилии (Flex, Silverlight, Ajax, JavaFX). Однако цель этой статьи не в том, чтобы сравнить их все. Вместо этого мы сосредоточимся на проверенной и все более популярной технологии Flex для пользовательского интерфейса. На сервере мы будем использовать JBoss Seam. Seam значительно упрощает разработку, объединяя такие технологии, как JSF, с EJB3, JPA и Hibernate.
сгибать
Flex-приложения запускаются внутри высокопроизводительного Flash-плеера от Adobe. Flash player (версия 9) — это вездесущая легковесная виртуальная машина, которая устанавливается в виде плагина внутри браузера и запускает приложения Flex. Сегодня Flash Player установлен практически на любой машине. Поскольку приложения Flex компилируются и запускаются на виртуальной машине (проигрывателе Flash), пользователь может получить более богатый пользовательский интерфейс, в отличие от стандартного сценария веб-браузера, в котором интерпретируются разметка (HTML) и JavaScript.
JBoss Seam
Seam — это облегченный фреймворк, цель которого — упростить разработку Java EE. Точнее говоря, это значительно упрощает разработку, объединяя JSF и JBoss RichFaces с EJB3, JPA или Hibernate. Из коробки Seam работает с JSF. Чтобы сделать еще один шаг вперед, он работает с RichFaces, компонентами JSF с поддержкой AJAX и возможностью создания скинов, для создания многофункциональных интернет-приложений внутри браузера без дополнительных плагинов.
Браузер является отличной платформой для создания многофункциональных интернет-приложений, но браузер как богатая платформа имеет ограничения. Чтобы ускорить процесс, как сказал бы Emeril Lagasse, пользовательский интерфейс на основе Flex, работающий внутри Flash-плеера (виртуальной машины), может использоваться внутри браузеров для предоставления еще более богатых приложений.
Теперь вопрос в том, как использовать Flex и JBoss Seam вместе? Мы только меняем пользовательский интерфейс, поэтому бэкэнд остается прежним. Ответ Эксадель Фламинго. Flamingo позволяет создавать пользовательские интерфейсы на основе Flex и легко подключаться к серверной части Seam.
Exadel Flamingo — Согните и соедините вместе
Exadel Flamingo — это инструмент для быстрой загрузки Flex с бэкэндом Seam. Фактически, он также поддерживает JavaFX для пользовательского интерфейса и Spring на бэкэнде. Так же, как JSF и RichFaces естественным образом работают с Seam, Flamingo делает Flex таким же естественным образом, как и Seam. Фламинго имеет три основных особенности:
инструменты
Flamingo предоставляет возможность быстро генерировать приложение типа CRUD с сущностями, базой данных и пользовательским интерфейсом. Создание веб-проекта Java EE стало довольно сложной задачей. Существует так много разных способов настройки проекта и множество зависимостей для разрешения. С помощью инструментов Flamingo вы можете не только быстро создавать новый проект, но и создавать фрагменты приложения по запросу в течение цикла разработки. Если вы когда-либо использовали инструмент seam-gen для создания проекта Seam, то Flamingo предоставляет аналогичные инструменты.
Интеграционная библиотека
Он служит связующим звеном между клиентом Flex и кодом сервера Seam, работающим за кулисами, поэтому разработчики могут сосредоточиться на бизнес-задачах вместо написания «простого» кода. Кроме того, связь между Flex и Seam осуществляется через двоичные протоколы.
(Они самые эффективные.)
Клиентские компоненты
Это невизуальные компоненты, которые облегчают разработку, обеспечивая проверку, привязку и возможность объединять несколько запросов в один. Одной из ключевых особенностей Flamingo являются динамические постоянные методы. Эти методы позволяют выполнять интуитивные запросы в базе данных на английском языке вместо использования SQL (SQL фактически создается Flamingo на лету.) Или создания объектов DAO (что иногда создает ненужную сложность). Только эта особенность предлагает резкое увеличение производительности. Flaming поддерживает Dynamic Finders и Dynamic Updaters. Вот пример методов динамического поиска:
@Entity
public class Person implements Serializable {
private String name;
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
}
и используя динамические методы:
<mx:RemoteObject id="person" destination="Person" result="resultHandler(event)"/>
...
private function resultHandler(event:ResultEvent):void
{
entities = event.result as ArrayCollection;
}
...
person.findAll();
person.findByNameLike("John%");
person.findByNameNotEqual("John Smith");
Методы поиска findAll, findByNameLike, findByNameNotEquals автоматически доступны без необходимости их записи.
Хватит болтать! Сначала мы рассмотрим быстрый пример, демонстрирующий прозрачность использования Flex с Seam, а затем пройдем пошаговое руководство, в котором будет показано, как создать приложение Flex-Seam.
Сначала мы начнем с компонента Seam. Если вы ранее использовали Seam, это должно выглядеть очень знакомо:
@Scope(ScopeType.STATELESS)
@Name("helloAction")
public class HelloAction {
public String hello(String name) {
return "Hello, " + name;
}
}
Далее, давайте посмотрим на клиент Flex:
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:word="*">
<mx:RemoteObject id="service" destination="helloAction"/>
<mx:Panel title="Flamingo AMF Hello World Sample" paddingTop="10" paddingBottom="10" paddingLeft="10" paddingRight="10">
<mx:HBox>
<mx:Label text='Whom do you want to say "Hello" to?'/>
<mx:TextInput id="who"/>
<mx:Button label="Say Hello" click="service.hello(who.text)"/>
</mx:HBox>
<mx:Label text='The server said: "{service.hello.lastResult}"'/>
</mx:Panel>
</mx:Application>
В этом примере показано, как метод hello компонента Seam сервера helloAction может быть вызван с помощью RemoteObject при нажатии на кнопку «Say Hello».
Наконец, вот файл services-config.xml:
<?xml version="1.0" encoding="UTF-8"?>
<services-config>
<services>
<service
id="hello-service"
class="flex.messaging.services.RemotingService"
messageTypes="flex.messaging.messages.RemotingMessage">
<destination id="helloAction">
<channels>
<channel ref="seam-amf"/>
</channels>
</destination>
</service>
</services>
<channels>
<channel-definition id="seam-amf" class="mx.messaging.channels.AMFChannel">
<endpoint
uri="http://{server.name}:{server.port}/helloworld/seam/resource/amf"
class="flex.messaging.endpoints.AMFEndpoint"/>
</channel-definition>
</channels>
</services-config>
В этом примере показан канал seam-amf с заданным URL-адресом для доступа к серверу, который применяется для использования целевого helloAction:
-
«{server.name}: {server.port}» — это имя сервера: порт сервера, на котором запущено ваше существующее приложение JBoss Seam;
-
«helloworld» — это название вашего существующего приложения;
-
«helloAction» — это имя компонента, указанного в файле «HelloAction.java» (см. аннотацию @Name («helloAction»))
Надеюсь, это даст вам представление о том, как легко подключить пользовательский интерфейс Flex с бэкэндом Seam. Теперь перейдем к нашему примеру.
Давайте что-то строить
Далее мы будем использовать Maven для создания готового к использованию приложения в стиле CRUD с пользовательским интерфейсом Flex, подключенным к серверной части Seam. Хотя приложение будет довольно простым, оно даст вам представление о том, как просто использовать и создавать интерфейсы на основе Flex с Seam. Для базы данных мы будем использовать HSQLDB.
Сборка начальных частей
Но сначала нужно сделать несколько вещей, прежде чем мы сможем создать наш первый проект Flex-Seam.
Adobe Flex
-
Загрузите Adobe Flex SDK 3 по адресу: http://opensource.adobe.com/wiki/display/flexsdk/Flex+SDK.
-
Распакуйте загруженный файл
-
Создайте переменную среды FLEX_HOME и укажите ее в корне установки Adobe Flex SDK
Maven 2
Мы будем использовать Maven для создания нашего приложения CRUD
-
Загрузите Maven 2 с: http://maven.apache.org/download.html
-
Распакуйте загруженный файл
-
Создайте переменную окружения M2_HOME и укажите ее в директории установки Maven,
-
Добавьте M2_HOME / bin в вашу PATH
Сервер приложений
Мы создадим проект Seam с компонентом EJB3, создадим файл EAR и развернем его на сервере приложений JBoss.
-
Загрузите сервер приложений JBoss по адресу: http://www.jboss.org/jbossas/downloads/
-
Распакуйте загруженный файл
Эксадель Фламинго
Наконец, вам необходимо скачать последнюю версию Exadel Flamingo.
-
Скачать Exadel Flamingo с: http://flamingo.exadel.com
-
Распакуйте загруженный файл
-
Перейдите в каталог <flamingo-1.6.0> / bin и запустите файл installflamingo.
-
При желании вы можете добавить каталог <flamingo-1.6.0 / bin> в переменную path . Это позволит вам запускать команды фламинго из любого места
Теперь, когда мы загрузили и настроили все части, мы готовы создать проект.
Генерация нового проекта
Чтобы начать генерацию проекта, перейдите в <flamingo-1.6.0> / bin (или, если вы изменили путь для включения этого каталога, вы можете запустить его из любого места) и введите:
flamingo create project
Вам будет задан ряд вопросов о проекте. В большинстве случаев будут работать значения по умолчанию, но в любом случае рекомендуется явно указывать их явно. Значения по умолчанию указаны в скобках [].
Затем ответьте на следующие вопросы с указанными ответами:
|
Вопрос |
Ваш ответ |
|
Пожалуйста, выберите тип приложения для создания [фламинго-весна, фламинго-шов] |
фламингоа шов |
|
Пожалуйста, введите местоположение, в котором будет создано ваше новое приложение (например, c: / java / development): |
Введите место, где вы хотите создать проект. (Для этого вопроса можно принять значение по умолчанию.) |
|
Введите название проекта (например, myproject): |
гибкий шов |
|
Пожалуйста, введите имя корневого пакета для вашего проекта (например, com.mydomain.myproject): |
com.yourcompany.flexseam |
|
Развернут ли этот проект как EAR (с компонентами EJB) или как WAR (без поддержки EJB)? [ухо, война]: |
ухо |
|
Будет ли этот проект иметь пользовательский интерфейс Flex или JavaFX? [flex, javafx]: |
сгибать |
|
Будет ли этот проект использовать протокол Гессена или AMF? [amf, гессиан]: |
амф |
|
Будут ли в этом проекте использоваться сервлеты Seam Remoting или Flamingo? [сервлеты, удаленные, оба]: |
Remoting |
|
Какую базу данных вы используете? [hsql, mysql, oracle, postgres, mssql, db2, sybase, нет]: |
HSQL |
|
Введите URL JDBC для вашей базы данных (например, jdbc: hsqldb :.): |
jdbc.hsqldb :. |
|
Введите имя пользователя базы данных: |
са |
|
Введите пароль базы данных: |
Оставьте пустым, нажмите Enter |
|
Хотите ли вы обновлять схему базы данных каждый раз при развертывании? [у, п]: |
Y |
|
Введите имя класса сущности (также будут созданы исходные файлы Flex для просмотра и изменения сущностей): |
Человек |
Чтобы увидеть, что было создано, перейдите в каталог, который вы выбрали для создания проекта.
Сборка развертываемого файла
Далее нам нужно создать файл EAR, который мы будем развертывать.
Перейдите в корневой каталог проекта и введите эту команду:
mvn package
После завершения сборки перейдите к flex-seam / ear / target. Там вы должны увидеть файл EAR flex-seam. Это файл, который мы сейчас собираемся развернуть на сервере приложений JBoss.
Развертывание и запуск
Проще всего скопировать файл EAR в каталог развертывания сервера приложений. Скопируйте файл в:
<jbossas>/server/default/deploy
Теперь осталось только запустить сервер:
<jbossas>/bin/run
После запуска сервера введите этот URL в веб-браузер:
http://localhost:8080/flex-seam
и вы увидите похожую картинку:
[Img_assist | NID = 4111 | название = | убывание = | ссылка = нет | выравнивание не = средняя | ширина = 790 | Высота = 547]
Как видите, создание самого проекта заняло всего несколько минут, и у нас есть довольно простое, но, тем не менее, полностью работающее приложение Flex-Seam.
Вывод
Flash player — это мощная виртуальная машина для предоставления многофункциональных интернет-приложений на основе Flex. В то же время, Seam значительно упрощает разработку Java EE. Создание приложений на основе Flex-Seam сегодня является чрезвычайно привлекательным решением для многих ИТ-менеджеров. Одна вещь, которая до сих пор отсутствовала — это простая интеграция между Flex и Seam. Вы могли бы сделать это самостоятельно, но вы потратили бы значительное количество времени на написание «правильного» кода, который не имеет ничего общего с бизнес-логикой приложения. Exadel Flmaningo делает именно это; он упрощает разработку Flex-Seam, предоставляя интеграцию, клиентские компоненты и инструменты быстрой разработки, такие как мгновенное создание проекта.