Adobe упростит разработку веб-приложений на основе AJAX и Flex


Оглавление (нажмите, чтобы открыть):

Adobe упростит разработку веб-приложений на основе AJAX и Flex

закрытое акционерное общество Adobe выпустила две библиотеки с открытым исходным кодом, которые должны упростить процесс разработки веб-приложений, одновременно использующих технологии Flex, Flash и AJAX. AJAX (Asynchronous JavaScript + XML — асинхронный JavaScript+XML) позволяет создавать веб-сайты, которые субъективно работают быстрее обычных. Ресурсы, построенные с применением технологии AJAX, позволяют выполнять многие действия без перезагрузки страницы. Это позволяет работать с веб-приложениями почти так же, как с традиционными программами. В настоящее время AJAX набирает всё большую и большую популярность среди разработчиков сайтов.

В свою очередь, Flex и Flash обладают рядом возможностей, которые отсутствуют у AJAX. В частности, поддерживаются работа с векторной графикой, кросс-доменный доступ к данным и прочее. Библиотеки Adobe как раз и должны установить своеобразный мост между Flex, Flash и AJAX.

Как сообщает eWeek со ссылкой на заявления Джеффа Уоткотта, одного из старших руководителей Adobe, библиотеки Flex-AJAX Bridge и AJAX Client for Flex Data Services должны не просто упростить процесс создания мультимедийных веб-приложений, но и существенно расширить их возможности. Демонстрация библиотек состоялась на конференции OReilly Emerging Technology Conference в Сан-Диего (штат Калифорния) 8 марта.

Adobe Flash и Flex, альтернатива AJAX?

Есть много сайтов, утверждающих, что Adobe Flash и Flex могут быть использованы в качестве альтернативы Ajax. Это правда. Flash используется для отображения видеоконтента на веб-странице, верно?
Как можно usd заменить ajax?

3 ответа

Javacript/ajax концептуально очень похож на ActionScript/Flash. (ActionScript — это язык программирования Flex.)

Actionscript — это строгий расширенный набор javascript с кучей дополнительных возможностей и дополнительных функций, которые делают людей, которые любят языки раннего связывания, удобными. (Как объявление типов переменных.)

Вместо запуска на виртуальной машине js в вашем браузере, например javascript, она запускается на виртуальной машине во Flash.

Вместо использования ajax для асинхронного взаимодействия с хостом в фоновом режиме, Adobe имеет свои очень похожие возможности.

Все это было очень удобно до того, как javascript/ajax распухли. И у него есть портативные библиотеки AIR VM для Windows, iOS и Linux, поэтому он может работать без размещения в браузере.

Хотя Adobe недооценивает эту технологию, потому что они видели, что будущее за HTML 5.

Есть много сайтов, утверждающих, что Adobe Flash и Flex могут быть использованы в качестве альтернативы Ajax. Я это правда.

Да, это правда. Flex — это пользовательский интерфейс для развития предприятия; он также использует среды выполнения Flash, что позволяет легко развертывать его на нескольких платформах, таких как приложения для настольных компьютеров (нацеленные на Flash Player), приложения на рабочем столе (нацеленные на Adobe AIR) и собственные мобильные приложения (с помощью Mobile AIR).

Flash используется для отображения видеоконтента на веб-странице, верно?

Может быть; но это не ограничивается этим. Сказать, что «Flash используется для отображения видеоконтента», все равно, что сказать «Джон Леннон был музыкантом» или «C++ может зацикливаться на структуре данных». Пока оба верны; но значительно упрощены и не передают всю широту возможностей.

Как это можно использовать для замены AJAX?

Flex — это UI Framework; поэтому он предлагает компоненты пользовательского интерфейса, встроенные в ActionScript (AKA The Language of Flash Player). У него есть механизм для настройки внешнего вида приложений. У него есть механизм связи с внутренними серверами. Это может помочь вам быстрее создавать приложения и обеспечить более согласованную работу в нескольких развертываниях.

Люди, с которыми я общаюсь, говорят, что корпоративные приложения, встроенные в решения HTML/JavaScript, занимают в 2-5 раз больше времени, чем решения Flex сегодня. Скорее всего, со временем ситуация изменится, поскольку инструменты и фреймворки улучшатся с точки зрения HTML/JavaScript.

Чтобы по-настоящему лучше понять Flex, вам следует прочитать документы или ознакомиться с серией видеороликов Adobe’s Flex in a Week.

Надеюсь, это дало объяснение, что такое Flex. Хотите ли вы изучать Flex сегодня или нет — это вопрос интерпретации. По моему скромному мнению, разработка Flash Player на основе браузера уйдет. Flex не поддерживается во многих мобильных браузерах (iOS и Windows Metro — два основных варианта); и это уменьшит выгоду от создания приложений Flash, предназначенных для браузера.

Я верю, что ВОЗДУХ будет продолжать процветать; так как он позволяет использовать Flex/ActionScript для создания настольных приложений и мобильных приложений. Adobe использует эту же технологию для создания своих сенсорных инструментов Creative Suite, таких как Photoshop Touch, поэтому мы можем быть уверены, что AIR не исчезнет в ближайшем будущем. Однако я ожидаю, что разработка AIR будет гораздо более нишевой, чем разработка Flash Player.

Система управления эфирными телеканалам, с эргономичным интерфейсом

Аннотация

В данной статье рассмотрено программное приложение, предназначенное для формирования и управления эфира телеканала, вещающего в Internet. Это приложение является web-ориентированным, и создано с учетом последних тенденций, характерных для сети.

In this article a new program device intended for formation and management of an ether of a telechannel, broadcasting in Internet. It is a web-focused, and is created in view of last tendencies, characteristic for a network.

Система управления эфирными телеканалам, с эргономичным интерфейсом.

Информация о проекте.

Роль веб-приложений в жизни информационного общества постоянно растет. Веб-приложения — это будущее сети, программных приложений, сетевых архитектур и даже компьютеров и операционных систем. Приложения, основанные и ориентированные на работу в Internet, проникнут практически во все виды программ, которыми мы пользуемся сегодня. Естественно, растущие потребности требуют новых затрат, ресурсов и технологий. В рамках информационной системы телевещания, организованной на кафедре ЭВА, МГИЭМ, был создан программный модуль, позволяющий систематизировать и упорядочить существующий видео материал и реализовать систему для формирования и управления эфирной сеткой телеканалов.

Информационная телевизионная система приема видео включает в себя: модуль преобразования формата принятого файла, каталог для хранения принятых файлов и модуль организации телевещания, так называемый – “playlist”. Последний будет рассмотрен в этой статье.

Для организации вещания используется Windows Media 9 Series Streaming Server. Он поучает потоковое видео в формате WMV и транслирует его. Изначально эфирный лист формировался как набор ссылок на расположенные в архиве видеофайлы, но это было весьма трудоемко, так как требовало специальных знаний, навыков и уровня доступа. Для устранения этих недостатков и было принято решение о создании данного сервиса.

Примененные технологии и особенности разработки.

Модуль “playlist” расположена и функционирует в сети Internet. Поэтому при ее создании учитывались особенности среды, в которой будет функционировать система. Для создания данного интерфейса были использованы: средства языка разметки HTML и XML, средства языков программирования Javascript, PHP и язык запросов к базе данных MYSQL. В проект включены готовые, свободно-распространяемые скрипты, библиотеки и модули, упрощающие процесс создания, настройки и функционирования систем с подобными интерфейсами управления, например библиотека языка php — XAJAX, обеспечивающая возможность использования и обращения к php функциям, как к функциям JavaScript. При создании пользовательского интерфейса, также уделено большое внимание, эргономике проекта, чтобы работа с приложением была приятна, и не напрягала зрение пользователя.

Данный программный модуль интегрирован в каталог для хранения видео, его работа базируется на данных, получаемых из каталога видео. Все размещенные в видео каталоге материалы, могут быть добавлены в Playlist на выбранный канал в список воспроизведения прямо из видео хранилища. “Playlist” реализован в виде 3-ех ячеек, содержащими ссылки. Ячейки соответственно: содержимое каталога, содержимое “Playlist” данного канала, удаленные ссылки. В совокупности, ссылки и ячейки представляют систему – Drag and Drop меню, которое реализовано средствами javaScript. В основе перемещение элементов лежат обработка событий таких как: наведение на ссылку, нажатие кнопки мыши на ссылке, удержание кнопки и перетаскивание ссылки, отпускание кнопки. Каждое событие вызывает определенное действие, в зависимости от того, какими свойствами обладают перемещаемые объекты и объекты “цели”. Так, например, событие отпускание мыши приводит к записи ссылки в базу, если ссылку перемещают во второй контейнер. Или удаление, при перемещение в последний. Все свойства, которыми обладал объект, сохраняются в специально созданном объекте javaScript, который может модернизироваться в процессе работы. Удаленные же из “Playlist” ссылки, сохраняются в буфере созданном на javaScript. Поэтому всегда можно восстановить ошибочно удаленную ссылку, однако, после перезагрузки страницы, “откат” не возможен. Экспорт “playlist” для каждого канала в отдельности, в формате ТВ-сервера, производится автоматически и формируется в отдельном файле, к которому, напрямую подключается Windows Media 9 Series Streaming Server, который уже и осуществляет трансляцию. В процессе разработки возникла стандартная проблемой — различные браузеры обрабатывают элементы на странице по-разному. Существует ряд свойств, поддерживаемых не всеми браузерами. Для устранение этого недостатка, была написана функции, имитирующие необходимые свойства. Так как планируется дальнейшее развитие и модернизация системы, возникнет потребность в поддержке работы со временем и датой. При этом основой должно будет стать именно время сервера, а не клиента. Для этого была создана специальная функция, которая при загрузке приложения получает серверное время, а затем, уже обрабатывает полученное значение динамически. Весь процесс управления вещанием происходит в режиме реального времени через сеть Internet, что позволяет управлять системой вещания удаленно из любой точки мира и в любое время, где есть доступ к сети, при наличии соответствующих прав доступа.

При создании “playlist”, помимо разработки эффективной программной части, особое внимание было уделено созданию продуманного, эргономичного, приятного и понятного пользователю интерфейса управления и навигации. Он напоминает стандартный интерфейс, используемый в таких известных продуктах как: Microsoft Office и Microsoft Windows. Такой выбор обусловлен тем, что навыками, необходимыми для управления подобными приложениями, обладают практически все пользователи современного ПК, что позволяет сделать систему простой и понятной пользователю. Для этого был произведен анализ существующих web технологий, остановимся на их особенностях более подробно.

Современные тенденции в разработке интерфейсов WEB приложений.

В настоящее время, в разработке WEB приложений, существует тенденция к разграничению клиентской и серверной части, этим и обуславливается повсеместное использование шаблонов, таких как Smarty и XSLT. Сейчас проекты становятся сложнее и переплетать между собой различные технологии становиться слишком дорого и для разработчика. Так, например, все стили форматирования выносятся в CSS или в XSL файлы, HTML или XML данные хранятся в других разделах, серверные обработчики в-третьих, базы данных в-четвертых. И если еще 5-6 лет назад практически везде можно было увидеть переплетение всего этого в одном файле, то сейчас это все чаще становиться редкостью. При разработке более сложных проектов возникает необходимость в структурированности и удобочитаемости кода. Не следует засорять код программиста кодом верстальщика, а код верстальщика — правками дизайнера, и так далее. Возникает необходимость в разграничении работы. Так, например, дизайнер будет делать свою работу, верстальщик свою, программист свою, и при этом никто друг другу мешать не будет. В итоге каждому участнику проекта достаточно будет знать только те данные, с которыми ему придется работать. В таком случае производительность группы и качество проекта повышается в разы. В настоящее время эта проблема с успехом решается путем использования шаблонов, однако это тоже создает определенные трудности.

Рассмотрение среды Java Script

На сегодняшний день, все веб-приложения работают по протоколу HTTP, по схеме клиент-сервер. То есть пользователь получает данные и далее, после внесения информации или ее изменений, они отправляются на сервер. В результате, вместо того, чтобы целиком сосредоточится на работе с данными, обработать их полностью, и по завершению всех этапов преобразования, сохранить изменения на тот же сервер, пользователю приходится периодически отправлять данные на сервер, зачастую для проведения абсолютно примитивных операций, например проверка правильности введенного e-mail. На практике это означает сплошные неудобства: ошибки при передаче данных, ошибки в введенной информации и, самое главное, потраченные нервы и время пользователя. Все это приводит к ухудшению качества трудовой деятельности и снижению продуктивности. Для того чтобы хоть как-то облегчить работу с приложениями был создан клиентский язык – Javascript. Благодаря нему существует возможность, для перенесения определенного количества программной логики в HTML-страницу, что ускорит реакцию на действия пользователя. Но здесь есть один недостаток. Одна из проблем заключается в том, что как только JavaScript попадает в браузер пользователя, программная логика доступна для просмотра невооруженным глазом. До некоторой степени это не угрожает проекту, но при передачи конфиденциальной информации, такое решение, зачастую, невозможно.

Вторым аспектом, который не способен решить Java Script заключается в том, что серьезную программную логику в страницу поместить невозможно. Интерфейс для этого просто не предназначен. Вся логика должна находиться на уровне приложения, а это значит, приходится возвращаться на сервер. Сложности вызывает и тот факт, что Java Script поддерживается не всеми браузерами или не все пользователи включают ее поддержку. Поэтому проверка или обработка данных, реализация программной логики должны обрабатываться на сервере. Очевидно, что функций Java script, в последнее время стало совершенно недостаточно, так как процедуру передачи и получения информации между сервером и клиентом язык упростить не смог. Передача существовала по средствам методов GET и POST. Но на сегодняшний день существует намного более рациональный способ обмена данными между клиентом и сервером — объект языка Java Script – XMLHttpRequest. Этот объект впервые был реализован компанией Microsoft в виде объекта ActiveX, но сейчас он доступен как встроенный объект в некоторых браузерах. Этот объект позволяет с использованием JavaScript осуществлять HTTP-запросы к удаленному серверу без необходимости перезагружать страницу. По сути HTTP-запросы отправляются и получаются полностью вне страницы, а пользователь их даже не замечает. Это позволяет достичь создания быстрого пользовательского интерфейса с сохранением при этом программной логики на сервере. Но технология на сегодняшний день еще не стандартизована, поэтому в различных браузерах она работает по разному, либо не работает вовсе.

Ajax технология

К сожалению, средствами XMLHttpRequest, возможно ускорить работу приложения, но улучшить интерфейс и создать иную систему работы с ним – невозможно. Улучшить ситуацию здесь помогает AJAX (Asynchronous JavaScript and XML) — подход к построению пользовательских интерфейсов веб-приложений, при котором web-страница, не перезагружаясь, сама догружает нужные пользователю данные. AJAX — один из компонентов концепции DHTML. Впервые об Ajax заговорили после появления в феврале 2005-го года статьи Джесси Джеймса Гарретта «Новый подход к веб-приложениям». Ajax — это не самостоятельная технология. Это идея, которая базируется на двух основных принципах. Использование DHTML для динамичного изменения содержания страницы. Использование XMLHttpRequest для обращения к серверу «на лету». Использование этих двух подходов позволяет создавать намного более удобные WEB-интерфейсы на тех страницах сайтов, где необходимо активное взаимодействие с пользователем. Использование Ajax стало наиболее популярно после того, как компания Google начала активно использовать его при создании своих сайтов, таких как Gmail, Google maps и Google suggest. Создание этих сайтов подтвердило эффективность использования данного подхода.

Если взять классическую модель WEB — приложения:

Клиент, набирая в строке поиска адрес интересующего его ресурса, попадая на сервер, делает к нему запрос. Сервер производит вычисления в соответствии с запросом, обращается к базе данных и так далее, после чего полученные данные идут клиенту и, в случае необходимости подставляются в шаблоны и обрабатываются браузером. Результатом является страница, которую мы видим, и которую 80% населения страны находящейся в WEB называют Интернетом. Это классическая модель, которая успела себя зарекомендовать и заслужить себе почетное место под солнцем. Это самая простая модель взаимодействия и, как следствие, самая распространенная. Однако ее все чаще становиться недостаточно.

Мастер Йода рекомендует:  Как не стоит делать важные интерфейсы гавайская версия


Теперь посмотрим на модель взаимодействия AJAX:

Последовательность действий клиента сохраняется и он, скорее всего не поймет того, что будет происходить. Но на стороне сервера все выглядит иначе. При обращении к серверу, генерируется страница, которая будет отображаться пользователю, и предлагать ему совершить интересующую его последовательность действий. При сознательном (хотя и не обязательно) выборе клиента, его запрос будет обращаться к AJAX модулю, который и будет производить все интересующие его вычисления и работу с сервером как таковым. Но в чем же новшество? Основное отличие в том, что этот метод дает нам возможность динамически обращаться к серверу и выполнять интересующие нас действия. Например, нам нужно выполнить обращение к базе данных и получить интересующие нас данные которые затем будем использовать. Данные мы будем хранить в XML файле который будет формироваться динамически. Так мы можем получить и обработать данные, полученные из БД, или что-нибудь другое необходимое нам. К тому же сервер будет обрабатывать только те данные, которые нам необходимо обновить, а не всю страницу в случае ее перезагрузки.

Отрицательные черты Ajax и средсва их устранения.

    Во-первых — передавать данные возможно только методом GET, соответственно затрудняется работа с большими объемами данных. Данная проблема имеет решения, путем использования Сookies, которые вполне приемлемы в случаях передачи больших данных, чем может вместить в себя GET запрос, а Javascript в свою очередь имеет функции для работы с ними. Вторая проблема — кросс-браузерность. Объект XMLHttpRequest еще не является частью какого-либо стандарта (хотя нечто подобное уже было предложено в спецификации W3C DOM Level 3 Load and Save). И, наконец, защищенность. Основная проблема заключается в том, что все данные и исходный код JavaScript функций можно увидеть путем просмотра исходного кода страницы, соответственно проследить логику выполнения запросов. Это создает рад проблем при передачи специальной информации, например паролей для авторизации. Возможным решением являются Cookies, с их помощью можно пересылать и обрабатывать необходимые данные.

AJAX с одной стороны — огромный скачок в WEB инженерии, но с другой стороны это давно назревавший этап эволюции, который открыл новые горизонты в сфере разработки программного обеспечения. В тоже время эта технология еще довольно «сыра». Но она постоянно развивается и улучшается, вместе с развитием Internet.

Класс RIA

Тенденция к усовершенствованию WEB интерфейсов постоянно заставляет крупные компании, работающие в этой сфере, разрабатывать и выпускать новые среды и модули. Одна из таких компаний – Adobe. Недавно она презентовала целый набор утилит и программ для разработки интерфейсов нового поколения. Называется этот набор Flex. Описывать систему самостоятельно не целесообразным, поэтому рассмотрим основные, наиболее важные характеристики, преимущества и отличия Flex, заявленные самим производителем.

Adobe Flex — технология для легкого и очень быстрого создания RIA, Rich Internet Applications. Flex — это родственная Flash технология, основанная на описании интерфейса приложения с помощью диалекта XML — MXML. Flex-приложение может компилироваться на сервере, а может — из IDE, как во Flash, результатом является swf файл, исполняемый Flash Player.

Отличие Flex от Flash. Достоинства Flex тесно связаны с его спецификой, MXML. Flash не позволяет создать настолько эффектного интерфейса, как это позволяет сделать Flex. Во Flash невозможна работа с динамическими данными, его возможности ограничены лишь загрузкой внешних роликов. Flex же в полной мере позволяет работать с быстро изменяющимися данными и обрабатывать их, в чем и заключается его основное преимущество. Хотя на сегодняшний день для многих задач привычного Flash вполне достаточно, в ближайшем будущем без систем аналогичных Flex обойтись будет невозможно. Например, в случае со строгими интерфейсами бизнес-приложений скорость разработки просто потрясающая. Также Flex славен своими графиками, компоненты для построения которых сделаны не только удобными для использования, но и в большинстве случаев выглядят очень приемлимо для использования. Пример — графики Google Analytics.

Все преимущество Flex-GUI в его фрэймворке (библиотека компонент), которая очень удачно спроектирована, вобрав в себя весь опыт предыдущих компонент. Другая составляющая — это компилятор mxmlc, который превращает mxml-код в обычный AS3-код, который, в свою очередь, компилируется в swf. Таким образом, Flex-GUI представляет собой связку удачно спроектированного фрэймворка, заточенного под mxml, и компилятора mxmlc.

Достоинства: Flex 2, помимо скорости разработки, предоставляет полные мультимедийные возможности Flash Platform : включая потоковое видео, звук (в том числе и программный), бинарные сокеты и большое число прочих новых возможностей ActionScript 3. Возможностей, которые, казалось бы, в 1.2 мегабайта запихать просто невозможно.

Недостатки: Отдельные части Flex технологии являются платными.

Сравнение и интеграция AJAX и Flex.

Компания Adobe упростила разработку веб-приложений на основе AJAX и Flex. Она выпустила две библиотеки с открытым исходным кодом, которые должны упростить процесс разработки веб-приложений, одновременно использующих технологии Flex, Flash и AJAX.

Сравнивая две эти среды, можно выделить преимущества той или иной среды разработки. AJAX позволяет создавать веб-сайты, которые субъективно работают быстрее обычных. Ресурсы, построенные с применением технологии AJAX, позволяют выполнять многие действия без перезагрузки страницы. Это позволяет работать с веб-приложениями почти так же, как с традиционными программами. Однако внешний вид приложений, по-прежнему реализуется стандартными средствами HTML и CSS, украшенных изображениями в различных форматах и swf роликами.

В свою очередь, Flex и Flash обладают рядом возможностей, которые отсутствуют у AJAX. В частности, поддерживаются работа с векторной графикой, кросс-доменный доступ к данным и прочее. Библиотеки Adobe должны установить своеобразный мост между Flex, Flash и AJAX. Но среда разработки Flex приложений является платной, что негативно отличает ее от технологии AJAX и других средств для создания web-приложений.

Вывод

Тенденции развития web-приложений направлены на то, чтобы работа с ними была максимально продуктивна, понятна, удобна, экономична, имела возможность интеграции с существующими системами и разработками. Несомненно, выполнение и реализация подобных задач средствами, разработанными боле 20 лет назад уже не эффективна, а зачастую и невозможна. Будущие проектов, требующих адекватного интерфейса, работающий для пользователя и по его правилам, а не по правилам машины, за новыми технологиями. Технология компании Adobe — Flex, вполне может выступать в качестве современного средства для выполнения поставленных задач. Учитывая скорость развития web, можно с уверенностью сказать, что разработка интерфейса, например, для системы телевещания, отличная возможность для применения Flex технологии. Несомненно, телевещание в Internet скоро будет совершенно обыденным явлением. Требования к качеству и его возможностям такого вещания будут расти вместе с ростом всемирной сети. Работа подобных систем будет рассчитана на многомиллионную аудиторию, что потребует от них помимо четко работающей технической части, доступный, приятный и понятный пользовательский интерфейс. Данный проект, на нынешнем уровне развития, не позволяет организовать вещание на многотысячную аудиторию, но является упрощенным прототипом таких систем как You Tube или RamblerTV. Однако, на его примере можно глубоко изучить все тонкости и особенности технологии вещания в Internet.

Adobe упростит разработку веб-приложений на основе AJAX и Flex

Flex — это большой набор классов, расширяющих возможности Flash. Flex-framework включает возможности локализации, стилизации приложения, разработки модульного приложения, встроенные валидаторы и форматоры текстовых полей — все те инструменты, которые нужны разработчикам приложений, работающих online.

Инструменты создания RIA основаны на flex-framework (Adobe Catalyst, Adobe Flex, Aptana Studio и т. д.). Инструменты для работы с анимацией и графикой используют только базовые возможности flash (поэтому баннеры и медийная реклама делаются без использования flex).

Достоинства

Интегрированная среда разработки Adobe Flash Builder (ранее известна как Flex Builder), которая обеспечивает более высокую производительность, создана на свободно распространяемой платформе разработки Eclipse. Поскольку многие разработчики уже используют Eclipse при программировании на Java, Flex Builder 2 предоставляет им знакомую среду для создания и Java-приложений, и полнофункциональных клиентов.

Flex, помимо скорости разработки, предоставляет полные мультимедийные возможности Flash Platform: включая потоковое мультимедиа, возможность получить доступ к веб-камере и микрофону пользователя, бинарные сокеты, обширные возможности сетевых коммуникаций (HTTP-запросы, веб-сервисы, встроенный формат сериализации AMF), оперирование координатами трехмерного пространства, возможности использования встроенных фильтров (таких как расфокусировка, падающая тень и др.), и написания собственных.

Благодаря Flex, веб-сервисы могут использоваться для связи с сервером при частом обращении к данным при небольшой полезной нагрузке. Для более ресурсоемких приложений Adobe предлагает программное обеспечение Flex Data Services 2 Express, которое может поддерживать связь между источником данных и уровнем представления.
Flex Data Services 2 способен передавать данные с сервера на клиент. Серверный компонент может, например, извлечь данные из серверного приложения SAP и переслать их клиенту. Теперь функции Flex Presentation Server встроены в Flex Data Services.

Ещё одно неоспоримое достоинство технологии Flex, тесно связанное с достоинствами ActionScript 3 — это возможность OpenSource разработки Flash-проектов без использования Adobe Flash Professional, с помощью «чистого» программирования. При этом Flash-разработка становится принципиально доступна в том числе и на Unix-платформах.

Недостатки

Работа flex-framework основана на относительно большом количестве собственного AS3-кода. Для примерной оценки: стандартный набор классов, включаемый по умолчанию в каждое разрабатываемое flex-приложение, занимает более 700 килобайт в итоговом swf-файле. Таким образом, общий объём кода, необходимый для исполнения flex-приложения, заметно увеличивается. В более поздних версиях флеш-плеера реализован механизм, который даёт возможность использовать классы flex, не включая их в каждый отдельный swf. При первом запуске такого swf, флеш-плеер подгрузит необходимые файлы с официального сайта в отведённый для этого кэш флеш-плеера. Однако, подгрузка дополнительных файлов из внешнего источника в некоторых случаях является неприемлемой или нежелательной. В этом случае, компоненты flex-framework должны быть скомпилированы и добавлены непосредственно в swf-файл, что заметно увеличивает размер swf-файла, если речь идёт о «легковесных» приложениях.

Ценовая политика

Flex SDK предоставляемый Adobe является бесплатным набором инструментария (framework) с полностью открытым исходным кодом (Open Source). Для работы с процедурами и классами этого фреймворка (написание кода, отладка, компиляция в исполняемый код) потребуется платное или бесплатное программное обеспечение (см. ссылки ниже).

Компания Adobe решила открыть исходный код среды Flex к концу 2007 года и начать распространение этого продукта на условиях Mozilla Public License (MPL). Известно, что в открытую версию Flex будут входить программное обеспечение для создания соответствующих приложений, набор библиотек и компиляторов, средство для разработки, интегрируемое в среду Eclipse IDE, а также система Flex Data Services, предназначенная для работы с базами данных.

История версий

  • Flex 1.0 — Март 2004
  • Flex 1.5 — Октябрь 2004
  • Flex 2.0 (Alpha) — Октябрь 2005
  • Flex 2.0 Beta 1 — Февраль 2006
  • Flex 2.0 Beta 2 — Март 2006
  • Flex 2.0 Beta 3 — Май 2006
  • Flex 2.0 Final- Июнь 28, 2006
  • Flex 2.0.1 — Январь 5, 2007
  • Flex 3.0 Beta 1 — Июнь 11, 2007
  • Flex 3.0 Beta 2 — Октябрь 1, 2007

  • Flex 3.0 Beta 3 — Декабрь 12, 2007
  • Flex 3.0 — Февраль 25, 2008
  • Flex 3.1 — Август 15, 2008
  • Flex 3.2 — Ноябрь 17, 2008
  • Flex 3.3 — Март 4, 2009
  • Flex 3.4 — Август 18, 2009
  • Flex 3.5 — Декабрь 18, 2009 [1]
  • Flex 4.0 — Март 22, 2010
  • Flex 4.5 Hero Preview Release [4] — Октябрь 2010
  • Flex 4.6
  • Flex 4.8.0

Компоненты

  • Cairngorm_(Flex_framework) (микроархитектура предоставленная Adobe)
  • PureMVC (микроархитектура)
  • Robotlegs (микроархитектура)
  • Mate (микроархитектура)
  • Spring Flex
  • ASWing — бесплатный набор компонентов, (open-source)
  • FLEXLIB — open-source библиотека компонент
  • FLEXMDI — библиотека для создания MDI-приложений

Среды разработки

Сравнение Flex IDE

Продукт Лицензия Производитель платформы
CodeDrive commercial iSpring Research Visual Studio
Flex Builder commercial Adobe win & mac & linux с ограниченными возможностями

(с версии 4 переименован в Flash Builder)

Eclipse WTP free eclipse
FlashDevelop free FlashDevelop Team Windows
PowerFlasher FDT commercial PowerFlasher eclipse
Aptana Studio commercial Aptana Studio eclipse
IntelliJ IDEA commercial JetBrains java
Spket IDE free & commercial eclipse

См. также

  • OpenLaszlo — альтернатива Flex технологии
  • Silverlight — альтернатива Flex технологии от Microsoft
  • JavaFX — альтернатива Flex технологии от Oracle
  • BlazeDS — для интеграции Flex с чем-либо (например, Java).
  • Pyamf — реализация протокола AMF и AMF3 на Python
  • Plasmads — реализация Flex Messaging и Remoting на Python

Ссылки

Внешние ссылки в этой статье не соответствуют правилам Википедии.
  • Флексипедия: русскоязычная флекс-вики
  • Руководство разработчика по Flex 2 (англ.)
  • Быстрый старт с Flex 2 (англ.)
  • Пример приложения на Flex 2 (англ.)
  • Все дофлексовые версии >(англ.)
  • Краткое описание онлайн-системы учёта ошибок в Adobe Flex (JIRA)
  • Русскоязычная FlexCookBook
  • Ещё одна русскоязычная FlexCookBook
  • ReflexUtil — ReflexUtil, расширение (с открытым исходным кодом) на время выполнения тестирования и дизайн Flex

IT пресса о Flex

Список с Community Flex. Часть статей написана ещё по альфа- и бета-релизам Флекса, поэтому возможны некоторые неточности.

Примечания


  1. Joab JacksonAdobe Donates Flex to Apache (англ.) . PCWorld (Nov 16, 2011). Архивировано из первоисточника 5 декабря 2012.Проверено 3 декабря 2012.
  2. Joab JacksonAdobe donates Flex to Apache (англ.) . TechWorld (17 November, 2011). Архивировано из первоисточника 5 декабря 2012.Проверено 3 декабря 2012.
  3. Delacretaz, Bertrand[RESULT][VOTE] Flex to join the Apache Incubator (англ.) . Список рассылки Apache Incubator General List (30 Dec 2011). Проверено 29 ноября 2012.
  4. Download Flex Hero — Flex SDK — Adobe Open Source
Adobe Systems
Клиентское ПО Creative Suite · Technical Communication Suite · Acrobat · Acrobat Connect · Audition · Captivate · Digital Editions · Director · GoLive · PageMaker · Photoshop Lightroom · больше
Серверное ПО ColdFusion · LiveCycle · Flash Media Server · JRun · Premiere Express · Photoshop Express
Технологии PostScript · PDF · FlashPaper · Authorware · Flash · Font Folio · DNG · Flex · AIR · BlazeDS
Сервисы Adobe Solutions Network
Совет директоров Charles Geschke · John Warnock · Bruce Chizen · Shantanu Narayen
Приобретение других компаний Объединения и приобретения · Aldus · Macromedia · Scene7
Инструменты разработки элементов графического интерфейса
Низко-
уровневые

Macintosh Toolbox/Carbon • Windows API • Intrinsics • Intuition • Xlib

Высоко-
уровневые
Amiga OS

BOOPSI • Magic User Interface • Zune • ReAction GUI

Разработка веб-приложений на основе технологии ajax в среде Microsoft Visual Studio Текст научной статьи по специальности « Автоматика. Вычислительная техника»

Аннотация научной статьи по автоматике и вычислительной технике, автор научной работы — Зимин Владимир Николаевич, Федосов Павел Валентинович

Технология AJAX позволяет реализовывать качественно новый тип веб-приложений. Это касается как увеличения скорости реакции на действия пользователя, так и сокращения объема данных, передаваемых между клиентской и серверной частями приложения. Применение специализированных сред разработки, например, Microsoft Visual Studio, значительно облегчает задачу разработки приложений такого типа.

Похожие темы научных работ по автоматике и вычислительной технике , автор научной работы — Зимин Владимир Николаевич, Федосов Павел Валентинович,

Текст научной работы на тему «Разработка веб-приложений на основе технологии ajax в среде Microsoft Visual Studio»

РАЗРАБОТКА ВЕБ-ПРИЛОЖЕНИЙ НА ОСНОВЕ ТЕХНОЛОГИИ AJAX В СРЕДЕ MICROSOFT VISUAL STUDIO

В.Н. Зимин, П.В. Федосов Научный руководитель — к. т.н., доцент Б.А. Крылов

Технология AJAX позволяет реализовывать качественно новый тип веб-приложений. Это касается как увеличения скорости реакции на действия пользователя, так и сокращения объема данных, передаваемых между клиентской и серверной частями приложения. Применение специализированных сред разработки, например, Microsoft Visual Studio, значительно облегчает задачу разработки приложений такого типа.

В последнее время в разработке веб-приложений наметилась тенденция усложнения и увеличения объема кода, выполняемого на стороне клиента. Это вызвано как существенным усложнением задач, решаемых веб-приложениями, и расширением круга этих задач, так и изменением архитектурной концепции построения веб-приложений. На современном этапе все большая роль в работе веб-приложения возлагается на его клиентскую часть, что заставляет разработчиков делать его все более объемным, надежным и гибким. Все это, в свою очередь, потребовало кардинального изменения подхода к самому процессу разработки таких веб-приложений и появления новых инструментов и сред разработки, отвечающих растущим требованиям со стороны пользователей. Среди технологий, используемых в веб-приложениях, все большую популярность приобретает технология AJAX (Asynchronous Javascript and XML). Технология AJAX позволяет реализовывать качественно новый тип веб-приложений. Это касается как увеличения скорости реакции на действия пользователя, так и сокращения объема данных, передаваемых между клиентской и серверной частями приложения, что, в свою очередь, увеличивает скорость работы приложения и сокращает нагрузку на сервер. Технически разработка AJAX-приложений возможна и с использованием старых средств разработки, однако применение специализированных сред, одними из которых являются Microsoft Visual Studio последних версий, серьезно облегчает эту задачу. В данной работе рассматриваются некоторые особенности разработки AJAX-приложений в интегрированной среде разработки Microsoft Visual Studio.

Свойства интегрированных сред разработки

Интегрированная среда разработки представляет собой приложение, реализующее инструменты для разработки приложений для той или иной платформы, собранные в единый набор. Как правило, интегрированная среда разработки содержит такие типичные элементы, как редактор исходного кода (обычно поддерживающий подсветку синтаксиса и автоматическое форматирование, характерное для используемого языка программирования), компилятор или интерпретатор, дополнительные утилиты и отладчик. Кроме того, часто в состав интегрированных сред разработки входят дополнительные средства, такие, как, например, утилита контроля версий. Большинство современных сред ориентированы на работу с графическими операционными системами и сами используют графический интерфейс пользователя. Для облегчения создания интерфейса пользователя графических приложений современные среды разработки содержат средства визуального проектирования, в значительной степени автоматизирующие этот процесс. Так как современные языки программирования, как правило, являются объектно-ориентированными, для автоматизации и стандартизации работы с классами и объектами среды разработки содержатся специализированные инструменты, такие как инспектор объектов (object inspector) или обозреватель классов (class browser) [1].

Таким образом, можно прийти к выводу, что интегрированные среды разработки созданы для повышения производительности труда программистов. В значительной степени это достигается путем предоставления программисту возможности использования больших фрагментов готового кода, поставляемого в рамках компонентов. Типичная среда ориентированна на конкретный язык программирования и оптимизирована для максимальной поддержки концепций и парадигм, свойственных этому языку. Тем не менее, существуют и многоязыковые среды, позволяющие использовать в рамках единой среды преимущества того или иного языка в зависимости от задачи, стоящей перед разработчиком. Примером таких сред могут служить такие продукты, как NetBeans и Microsoft Visual Studio.

Потребность в создании интегрированных сред разработки возникла тогда, когда производительность труда программиста при использовании классических (не интегрированных) средств перестала отвечать растущим запросам индустрии. Первым языком, ориентированным на использование в рамках единой среды разработки, был один из вариантов Бейсика. Разумеется, эта среда не имела графического интерфейса пользователя и других типичных для сегодняшних продуктов этого класса элементов. Однако она объединяла в себе средства редактирования исходного программного кода, управления файлами, компиляции, выполнения и отладки программ, т.е. имела все основные черты, характерные для современных приложений такого класса.

Стоит так же отметить, что, несмотря на очевидные преимущества, даваемые интегрированными средствами разработки в сравнении с классическими средствами, их внедрение не сразу было воспринято положительно использовавшими их разработчиками программного обеспечения. Причина этого кроется в том, что из-за стандартизации подходов к разработке программных продуктов, лежащих в основе самой концепции интегрированной среды, поле для творчества разработчиков неизбежно сужалось. Это стало одним из неизбежных следствий внедрения новой модели разработки программного обеспечения [1].

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

Используя гибкость и мощь такого подхода в области распределенных систем и широкие возможности современных веб-браузеров (таких как Internet Explorer и Firefox), можно с минимальными трудозатратами создавать достаточно мощные веб-приложения. Такой подход используется также в специализированных программах, таких, как Openlab, где конечным пользователям требуется гибкость и широкие возможности полноценного языка программирования, но без проблем, связанных с обучением ему [1].

Среда Microsoft Visual Studio 2008

Одной из самых современных интегральных сред разработки на сегодняшний день является продукт Microsoft Visual Studio 2008. Среда разработки Microsoft Visual Studio — это набор инструментов и средств, предназначенных для помощи разработчикам программ любого уровня квалификации в решении сложных задач и создания новаторских решений. Роль Visual Studio заключается в том, чтобы улучшить процесс разработки и упростить разработку высокоэффективных программ. Следует отметить

высокопроизводительные редакторы кода, поддержку технологии IntelliSense, мастеров и различных языков кодирования в одной интегрированной среде разработки. Разработчики, применяющие Visual Studio, получают в свое распоряжение интегрированный продукт, включающий инструменты, серверы и службы. В Visual Studio содержатся инструменты для всех этапов разработки программного обеспечения (разработка, тестирование, развертывание, интеграция и управление). Visual Studio 2008 в сравнении с предыдущими версиями имеет переработанный пользовательский интерфейс. Общий вид главного окна Microsoft Visual Studio 2008 представлен на рис. 1 [2].

Рис. 1. Вид главного окна VS 2008

Суть технологии AJAX (Asynchronous Javascript and XML) заключается в изменении содержимого загруженной веб-страницы без ее полной перезагрузки, благодаря чему достигается высокая динамичность сайтов. Технология основывается на разделении данных и подзагрузки тех или иных компонентов по мере необходимости [3].

С архитектурной точки зрения технология AJAX представляет собой совокупность двух элементов: библиотеку клиентских скрипов и набор сервисных расширений. Библиотека клиентского кода реализована на языке JavaScript и, таким образом, совместима со всеми современными браузерами. Серверные расширения полностью интегрированы с серверными сервисами, элементами управления и т.д. [4].

С другой стороны, AJAX — это не самостоятельная технология, а, скорее, концепция использования нескольких смежных технологий. AJAX базируется на двух основных принципах:

• использование технологии динамического обращения к серверу «на лету», без перезагрузки всей страницы полностью (например: с использованием XMLHttpRequest; через динамическое создание дочерних фреймов; через динамическое создание тега

Создание Web-приложений на базе Flex 4 и Java

Учимся применять удаленное взаимодействие объектов

К современным Web-приложениям предъявляются все более высокие требования. Они должны уметь работать с учетными данными пользователей, обеспечивать загрузку контента и потокового видео. Эти задачи требуют использования технологий, ускоряющих процесс разработки и в то же время обеспечивающих поддержку всех наиболее востребованных функций. Разработчики приложений RIA должны уметь правильно выбирать комплексы технологий, позволяющие наилучшим образом решать поставленные задачи.

Часто используемые сокращения
  • AMF: Action Message Format – формат сообщений о действиях
  • API: Application programming interface – интерфейс программирования приложения
  • CSS: Cascading stylesheet – каскадная таблица стилей
  • GUI: Graphical user interface – графический интерфейс пользователя
  • HTTP: Hypertext Transfer Protocol – протокол передачи гипертекста
  • JAR: Java archive – архив Java

  • POJO: Plain old Java object – простой Java-объект в старом стиле
  • RIA: Rich Internet Application – насыщенное Интернет-приложение
  • RPC: Remote procedure call – удаленный вызов процедуры
  • SDK: Software development kit – набор инструментальных средств разработки программного обеспечения
  • SQL: Structured Query Language – язык структурированных запросов
  • UI: User interface – пользовательский интерфейс
  • WAR: Web archive – Web-архив
  • XML: Extensible Markup Language – расширяемый язык разметки

Adobe Flex – это технология, работающая на стороне клиента и позволяющая разработчикам использовать богатый набор API-вызовов для создания графических пользовательских интерфейсов, вывода графики, воспроизведения мультимедиа-содержимого и подключения к Web-сервисам. Технология Java, применяемая на стороне сервера, обеспечивает такие возможности, как подключение к реляционным СУБД, многопоточная обработка запросов на обслуживание и оптимальное масштабирование в случаях увеличения нагрузки. Совместное использование этих двух технологий дает мощную техническую основу для создания RIA-приложений.

В этой статье будет показано, как написать простое, но мощное RIA-приложение, использующее технологию Flex на стороне клиента, технологию Java на стороне сервера и СУБД MySQL в качестве системы хранения данных.

Пример приложения

В нашем примере приложения (см. раздел Загрузка) имеется функционально насыщенный пользовательский интерфейс, поддерживающий создание, чтение, обновление и удаление (функции CRUD – Create, Read, Update, Delete) информации о контакте через приложение Adobe Flash® (SWF). На рисунке 1 изображена трехуровневая Web-архитектура, в которой клиентская часть представлена SWF-файлом, встроенным в Web-страницу, серверная часть выполняется внутри контейнера Java-сервлета (в нашем случае это Apache Tomcat), а в качестве базы данных используется MySQL. Совместное использование этих трех технологий позволяет создать мощное распределенное приложение.

Рисунок 1. Приложение Contacts

Для обеспечения взаимодействия между Flash-приложением и контейнером Java-сервлета инфраструктура BlazeDS предоставляет в ваше распоряжение функцию удаленного взаимодействия с объектами – особую форму удаленного вызова процедур, позволяющую объектам Adobe ActionScript™ обращаться к объектам Java и наоборот. Взаимодействием между приложением Java-сервера и реляционной базой данных управляет ORM-инфраструктура Hibernate, которая позволяет преобразовывать объекты Java в код SQL и наоборот.

Серверная часть приложения

Сначала мы создадим Java-класс, содержащий всю информацию, необходимую для хранения данных о контактах. В нашем тестовом приложении реализована простая модель, содержащая базовую информацию. В объектах Contact используются следующие атрибуты и типы данных.

— String emailAddress
— String firstName
— long id
— String lastName
— String phoneNumber
— long serialVersionUID
+ Contact()
+ Contact(String first, String last, String email, String number)
+ String getEmailAddress()
+ String getFirstName()
+ long getId()
+ String getLastName()
+ String getPhoneNumber()
+ void setEmailAddress(String address)
+ void setFirstName(String first)
+ void setId(long newId)
+ void setLastName(String last)
+ void setPhoneNumber(String number)
+ StringtoString()

Аннотации бизнес-объекта

Java-класс Contact считается классом POJO, выступающим в роли бизнес-объекта; это означает, что в нем должны быть реализованы функции и методы конкретной бизнес-области. Данные внутри объектов класса Contact необходимо сохранять в базе данных. Решением этой задачи является использование инфраструктуры объектно-реляционного отображения (ORM), такой как Hibernate, которая выполняет всю основную работу по преобразованию объектов в записи таблиц БД и обратно. Если вы используете аннотации Java Persistence API (JPA), для реализации ORM требуется написать лишь незначительное количество кода. В листинге 1 представлена аннотация Java-класса Contact .

Листинг 1. Java-класс Contact

Начнем рассмотрение этого простого класса с используемых в нем аннотаций.

  • @Column : маркирует свойство в качестве столбца базы данных, позволяя задавать для него имя, определять уникальность и возможность хранить null-значения.
  • @Entity : объявляет класс в качестве объекта entity bean; это означает, что данный класс является классом POJO, предназначенным для сохранения.
  • @GeneratedValue : определяет метод генерации первичных ключей; доступны значения AUTO , IDENTITY , SEQUENCE и TABLE
  • @Id : определяет свойство в качестве уникального идентификатора (то есть первичного ключа) для каждого Java-объекта.
  • @NamedQueries : хранит список именованных запросов.
  • @NamedQuery : объявляет предопределенный запрос в качестве строковой константы; обратившись к ней впоследствии, можно вызвать запрос на исполнение.
  • @Table : объявляет Java-класс в качестве таблицы базы данных.

Каждый раз, когда необходимо сохранить находящийся в памяти Java-объект, Hibernate преобразует информацию о его состоянии в SQL-оператор UPDATE. Аналогичным образом SQL-операторы с их возвращаемыми наборами данных используются для формирования Java-объектов. В результате этих операций все объекты могут сохраняться в базе данных в виде записей, а все записи могут быть извлечены из базы данных и преобразованы обратно в Java-объекты.

Аннотации указывают Hibernate, какие компоненты класса должны считаться сохраняемыми. Но это только часть картины.

Бизнес-сервис: связь с базой данных

Для обращений к библиотеке Hibernate с целью выполнения ORM-преобразований нам потребуется служебный класс. В листинге 2 представлен код класса ContactsService , выступающего в роли сервиса приложений.

Листинг 2. Класс ContactsService

Каждый метод получает ссылку на класс EntityManager , который представляет собой хранящийся в памяти кэш. Кэширование — мощная технология, обеспечивающая эффективность работы, поскольку запись и получение информации из базы данных могут отнимать много ресурсов. С вашей стороны требуется лишь обеспечить фиксацию или откат (в случае необходимости) каждой транзакции для кэшированных данных.

В JPA кэш представлен классом EntityManager , и для его для обозначения используется термин контекст хранения. Каждый контекст хранения управляет набором сущностей, которые являются Java-объектами, объявленными при помощи аннотаций @Entity . Класс EntityManagerFactory представляет собой модуль хранения, отвечающий за настройку подключений к хранилищу данных (например, к реляционной БД), управление типами сущностей (то есть всеми классами указанного контекста, которые необходимо преобразовывать для размещения в хранилище данных) и, наконец, за предоставление доступа к экземплярам контекста хранения (то есть класса EntityManager ).

Испытайте бесплатную версию сервера баз данных DB2 Express 9

Бесплатный, простой в использовании и развертывании сервер DB2 Express-C настраивается за считанные минуты, содержит функции самоуправления и всю базовую функциональность СУБД DB2 для платформ Linux®, UNIX® и Windows®, включая поддержку pureXML™. DB2 Express-C предоставляет те же основные возможности, что и другие редакции DB2 Express, и является отличной основой для создания и развертывания приложений, написанных на C/C++, Java, .NET®, PHP, Ruby on Rails, Python и других языках программирования.

В отличие от создания контекста хранения, создание модуля хранения может занять много времени. Настройка подключения к хранилищу данных, нахождение всех классов, объявленных как сущности, и настройка логики для привязки этих классов к сущностям хранилища данных требуют больших затрат. Поэтому создавать экземпляр класса EntityManagerFactory следует во время запуска приложения. Что касается контекста хранения – необходимо позаботиться о том, чтобы перед созданием каждого экземпляра EntityManager всегда уничтожался предыдущий экземпляр. Другое важное правило заключается в необходимости следовать модели entitymanager-per-request, которая группирует обращения к базе данных (например, запросы и операции обновления) таким образом, чтобы все они передавались одновременно. Такая модель позволяет использовать все преимущества механизма кэширования JPA.

Теперь перейдем к написанию клиентской части приложения.

Клиентская часть приложения

Инфраструктура Flex позволяет создавать приложения, которые пользователи могут воспроизводить с помощью Adobe Flash Player. Flex состоит из следующих компонентов.

  • Основанный на XML декларативный язык описания интерфейсов, известный как MXML
  • Язык программирования ActionScript.
  • Библиотеки времени выполнения для создания пользовательских интерфейсов, Web-соединений, а также для реализации многих других возможностей.
  • Инструменты для компиляции приложений в SWF-файлы.

В клиентском приложении, рассматриваемом в этой статье, используется инфраструктура Flex версии 4. Прежде чем перейти к клиентскому приложению, важно понять, как создаются приложения Flex и как они существуют в форме исполняемых файлов внутри Flash Player.

Сначала вы можете создать приложение, используя комбинацию разметки MXML и кода ActionScript. Общая последовательность действий заключается в написании GUI-интерфейса (уровень представления) с использованием формата MXML и последующем написании кода ActionScript (бизнес-логика и обработка событий). Поскольку работа с MXML и ActionScript происходит в текстовом режиме, для создания Flash-приложений требуется только текстовый редактор и инструментарий Flex SDK.

После написания приложения Flex его код компилируется с помощью компилятора MXML. Компилятор MXML создает SWF-файлы, которые могут быть запущены в Web-браузере (с помощью плагина Flash Player).

Наконец, Flash-приложения выполняются внутри виртуальной машины ActionScript Virtual Machine 2 (AVM2) по принципу «временной линейки» (timeline). В соответствии с этим принципом выполнение программы разбивается на кадры, подобно кинофильму. На этапе компиляции Flash-приложения вы задаете для него требуемое количество кадров в секунду. Кроме того, выполнение приложений Flash Player разбивается на ряд следующих задач.

  • События Flash Player, такие как таймер и события мыши.
  • Пользовательский код.
  • Логика предварительного рендеринга, на этапе которого Flash Player пытается определить необходимость обновления графического интерфейса пользователя вследствие изменения исходных значений.
  • Пользовательский код, связанный с изменением исходных значений.
  • Рендеринг Flash Player.


Если требуется выполнять рендеринг лишь нескольких кадров в секунду, можно выполнять больше пользовательского кода. Однако если требуемая частота кадров высока (например, 60 кадров в секунду), Flash Player может не справиться с обработкой большого объема пользовательского кода, поскольку для его выполнения может не хватить отведенного времени. Об этом важно помнить при написании приложений для Flash Player.

MXML – это мощный декларативный XML-формат, реализующий следующие возможности.

  • Минимизация объема кода (в силу декларативной сущности формата XML), требуемого для написания графического интерфейса.
  • Упрощение кода графического интерфейса благодаря четкому разделению логики представления и логики взаимодействия.
  • Поддержка подхода к разработке ПО с использованием шаблонов проекта.

В листинге 3 представлен код MXML-класса Application .

Листинг 3. Класс ContactsApp

Остановимся на рассмотрении наиболее важных моментов листинга 3 .

  • Корневым элементом MXML-документа является подкласс класса Application .
  • Элемент mx:Style позволяет задать свойства CSS для локального оформления компонентов пользовательского интерфейса. Оформление можно задать с помощью локальных определений (как это сделано в листинге 3), ссылок на внешние таблицы стилей, указания стилей внутри компонентов, а также с помощью метода setStyle языка ActionScript.
  • Класс RemoteObject представляет собой объект HTTP-сервиса, выполняющий операции удаленного взаимодействия с сервером.
  • Элемент mx:Script содержит блоки кода ActionScript, заключенные в раздел CDATA .
  • В коде присутствует только одна компоновка (то есть класс VBox ).
  • Каждый раз, когда в приложении объявляется компонент пользовательского интерфейса (например, TextArea ), генерируется переменная экземпляра, на которую впоследствии можно ссылаться с помощью атрибута компонента id .
  • Привязка данных осуществляется с помощью фигурных скобок (например, атрибут text элемента TextArea привязан к переменной экземпляра языка ActionScript message ).

ActionScript

Пользовательский интерфейс определяется с помощью MXML, а язык ActionScript используется для обработки событий, привязки данных (через тег метаданных [Bindable] ) и обращения к удаленным сервисам. Все методы в листинге 3 – createContact , editContact , deleteContact и getAllContacts – обращаются к удаленным методам на стороне сервера. При вызове удаленных методов ActionScript можно использовать для обработки результатов (как успешных, так и неудачных) путем объявления функций обратного вызова. Функция handleResult в листинге 3 получает результат в качестве объекта Object и передает его объекту ArrayCollection . BlazeDS преобразует объект List в объект ArrayCollection на стороне сервера.

В листинге 4 представлен ActionScript-код класса Contact , который создается для представления объектов контакта на стороне Flash.

Листинг 4. ActionScript-класс Contact

Эти объекты ActionScript передаются на сторону сервера, где BlazeDS преобразует объекты ActionScript в объекты Java. ActionScript-класс Contact рассматривается как объект передачи данных (Data Transfer Object, DTO).

Настройка приложения

Приложение, рассматриваемое в этой статье, использует конфигурационные файлы, содержащие параметры сервера. Две важнейшие области конфигурирования – это Hibernate и BlazeDS.

Настройка Hibernate

Параметры инфраструктуры Hibernate можно настроить с помощью стандартного конфигурационного файла JPA persistence.xml, представленного в листинге 5.

Листинг 5. Конфигурационный файл persistence.xml

Чтобы обеспечить доступ к данным файла persistence.xml в среде Hibernate, его необходимо поместить в папку Web-приложения WEB-INF/classes/META-INF. После того как файл будет помещен в указанную папку, он должен содержать следующую информацию.

  • Диалект базы данных (к какой именно базе данных происходят обращения, поскольку разные базы данных могут иметь разные SQL-диалекты).
  • Табличное пространство, определенное с помощью схемы по умолчанию.
  • Драйвер, использующийся для подключения к базе данных
  • URL-адрес базы данных.
  • Объекты для автоматического обнаружения (например, аннотированные классы, XML-файлы сопоставлений Hibernate и так далее).
  • Имя и пароль пользователя.

Остальные параметры могут влиять на работу Hibernate, но не являются обязательными.

Настройка BlazeDS

Инфраструктура BlazeDS настраивается с помощью четырех конфигурационных файлов.

  • messaging-config.xml: файл настройки схемы обмена сообщениями «издатель-подписчик».
  • proxy-config.xml: файл настройки параметров прокси для HTTP- и Web-сервисов.
  • remoting-config.xml: файл настройки параметров сервисов удаленного взаимодействия, таких как приложение, рассматриваемое в этой статье.
  • services-config.xml: конфигурационный файл верхнего уровня, содержащий ссылки на все остальные файлы, а также настройки безопасности, параметры каналов и журналирования.

В листинге 6 показано содержимое файла services-config.xml. Обратите внимание на то, что в нашем приложении используется только один файл – remoting-config.xml, поскольку мы работаем только с сервисом удаленного взаимодействия BlazeDS.

Листинг 6. Конфигурационный файл services-config.xml

Конфигурационный файл services-config.xml ссылается на другие конфигурационные файлы (которые должны существовать), а также настраивает систему журналирования BlazeDS и несколько каналов. Канал – это абстракция протокола, используемого для взаимодействия клиента с сервером. В приложении этой статьи используется стандартный протокол AMF без опроса. Опрос означает, что клиенты постоянно взаимодействуют с сервером с целью убедиться, что соединение не разорвано. В нашем приложении этого не требуется.

Присоединяйтесь к сообществу Web-разработчиков портала My developerWorks

Принимайте участие в обсуждении различных вопросов и обменивайтесь информацией с другими разработчиками Web-приложений в группе Web-разработчиков портала My developerWorks.

Еще не являетесь участником My developerWorks? Присоединяйтесь сейчас!

С помощью конечной точки канала задается URL-адрес сервера. Для успешной компиляции проекта всегда должна быть указана конечная точка; клиентское Flash-приложение использует ее в качестве жестко заданного значения, определяющего сервер, к которому необходимо подключаться. На практике URL-адрес конечной точки можно задать непосредственно в коде MXML или ActionScript.

Наконец, в конфигурационном файле remoting-config.xml (листинг 7) указывается класс адаптера, необходимого для обработки операций удаленного взаимодействия, а также классы, отвечающие на удаленные вызовы (в нашем случае классом, отвечающим на удаленные запросы, является класс bcit.contacts.ContactsService ).

Листинг 7. Конфигурационный файл remoting-config.xml

Заключение

В этой статье было продемонстрировано, как написать Web-приложение, работающее на стороне Java-сервера под управлением Tomcat и отвечающее на запросы для получения контактной информации. Вы также узнали, как с помощью MXML и ActionScript написать Flex-приложение, работающее на стороне клиента. В качестве хранилища данных мы использовали MySQL, а преобразование Java-объектов в SQL-запросы осуществлялось с помощью ORM-инфраструктуры Hibernate. Наконец, инфраструктура BlazeDS позволяет Flash-приложениям осуществлять удаленные вызовы процедур и получать удаленный доступ к Web-приложениям, запущенным на стороне Java-сервера.

Ресурсы для скачивания

  • этот контент в PDF
  • Образец кода (JEE-BlazeDS-Flex-contacts.zip | 7 МБ): В zip-архиве содержится весь исходный код (Java, ActionScript 3, MXML) рассмотренного проекта, build-файл Ant для генерации WAR, конфигурационные файлы, а также сторонние библиотеки (в виде JAR-файлов), которые были использованы в этой статье.

Похожие темы

  • Оригинал статьи: Create Flex 4 and Java Web applications (EN).
  • Узнайте больше о принципах JPA (EN) на Web-сайте Apache Software Foundation.
  • Научитесь работать с сущностями, прочитав обучающее руководство по Java EE Управление сущностями (EN).
  • Руководство пользователя Hibernate EntityManager (EN) – получите всю необходимую информацию для работы с объектом инфраструктуры Hibernate EntityManager .
  • Понимание компонентов и жизненного цикла инфраструктуры Flex 3 (Джеймс Поланко и Аарон Педерсен, DevelopmentArc) (EN) – узнайте, как повысить эффективность работы с Flex.
  • Обновленные правила «Elastic Racetrack» для Flash 9 и AVM2 (Шон Кристманн) (EN) – узнайте больше о правилах оптимизации фреймов внутри Flash Player.
  • Узнайте больше о явных преобразованиях объектов ActionScript и Java (EN) из руководства Adobe LiveCycle® Data Services Developer’s Gu >

Комментарии

Войдите или зарегистрируйтесь для того чтобы оставлять комментарии или подписаться на них.

Национальная библиотека им. Н. Э. Баумана
Bauman National Library

Персональные инструменты

Adobe Flex

Apache Flex

Разработчики: Apache Software Foundation and Adobe Systems
Выпущена: June 20, 2004
Постоянный выпуск: 4.15.0 / 11 January 2020 года ; 3 years ago ( 2020-01-11 )
Состояние разработки: Active
Написана на: ActionScript, Java (programming language)
Операционная система: Windows, macOS, Linux, Android (operating system), iOS, BlackBerry Tablet OS
Локализация: Various between websites
Тип ПО: Software development kit application
Лицензия: Apache License version 2.0
Веб-сайт Apache Flex and Adobe Flex

Adobe Flex (или Apache Flex) — комплект средств разработки (SDK (Software Development Kit)) для создания кросс-платформенных насыщенных интернет-приложений (Rich Internet Applications) на основе Flash. [Источник 1]

Adobe Flex – это сравнительно новая и весьма продвинутая платформа для разработки тонких Web-приложений, основанная на технологии Adobe Flash. Среда разработки представляет собой бесплатный SDK, плюс плагин Eclipse >[Источник 2]

Flex расширяет базовые возможности flash, позволяя описывать интерфейс приложения на XML (eXtensible Markup Language) языке. Логика приложения пишется на ActionScript3. Результатом компиляции является SWF файл предназначенный для выполнения в браузере (На платформе Adobe Flash Player), или как самостоятельное приложение (на платформе AIR).

Flex-приложение может компилироваться на сервере (для этого потребуется mod_flex.so или mod_flex.dll в зависимости от ОС и веб-сервера), а может — из IDE или непосредственно из командной строки с помощью компилятора mxmlc (начиная с Flex 2), как и во Flash, результатом является файл swf, исполняемый в Flash Player.

Содержание

Отличия Flex от Flash

Flex framework имеет локализацию и стилизацию приложения, а так же включает возможности разработки модульного приложения, встроенные валидаторы и форматоры текстовых полей, т.е. практически все инструменты, которые так нужны большинству разработчиков приложений, работающих online.

Flex SDK существенно расширяет стандартный возможности Flash технологии, позволяя свободно описывать интерфейс создаваемого приложения на языке XML (eXtensible Markup Language), ускоряя и упрощая при этом весь процесс разработки веб-приложений. Вся бизнес логика приложения пишется на языке программирования ActionScript. Результатом компиляции созданного проекта является SWF файл, предназначенный для исполнения в веб-браузере (на основе Flash Player) или как полностью самостоятельное полноценное настольное приложение (на базе AIR). Flex приложение может свободно компилироваться и на веб-сервере Apache, только для этого потребуется дополнительный модуль mod_flex so или mod_flex dll в зависимости от операционной системы и веб-сервера, а может — из непосредственно >[Источник 3]

Инструменты для работы с анимацией и графикой используют базовые возможности flash. Поэтому баннеры и медийная реклама делаются без использования flex.

Flex не предоставляет таких средств, как рисование векторных изображений и анимации. [1] Предполагается, что при необходимости использования .swf-анимаций в качестве элементов оформления, разработчик импортирует готовые анимации из Flash. Однако в Flex предусмотрен набор стандартных эффектов, таких как движение, размывание, изменение цвета или альфа-канала и т.п. Также имеются средства группировки эффектов, с параллельным или последовательным выполнением, с возможностью вложения групп. Эффекты удобно использовать, например, для анимации выпадающих меню. [Источник 4]

Достоинства

Flex, помимо скорости разработки, предоставляет полные мультимедийные возможности Flash Platform:

  • потоковое мультимедиа;
  • возможность получить доступ к веб-камере и микрофону пользователя;
  • бинарные сокеты;
  • обширные возможности сетевых коммуникаций (HTTP-запросы, веб-сервисы, встроенный формат сериализации AMF);
  • оперирование координатами трехмерного пространства;
  • возможности использования встроенных фильтров (таких как расфокусировка, падающая тень и др.) и написание собственных. [Источник 5]

Благодаря Flex, веб-сервисы могут использоваться для связи с сервером при частом обращении к данным при небольшой полезной нагрузке. Для более ресурсоемких приложений Adobe предлагает программное обеспечение Flex Data Services 2 Express, которое может поддерживать связь между источником данных и уровнем представления. Flex Data Services 2 способен передавать данные с сервера на клиент. Серверный компонент может, например, извлечь данные из серверного приложения SAP и переслать их клиенту. Теперь функции Flex Presentation Server встроены в Flex Data Services.

Ещё одно неоспоримое достоинство технологии Flex, тесно связанное с достоинствами ActionScript 3 — это возможность OpenSource разработки Flash-проектов без использования Adobe Flash Professional, с помощью «чистого» программирования. При этом Flash-разработка становится принципиально доступна в том числе и на Unix-платформах.

Недостатки

Работа flex-framework основана на относительно большом количестве собственного AS3-кода. Для примерной оценки: стандартный набор классов, включаемый по умолчанию в каждое разрабатываемое flex-приложение, занимает более 700 килобайт в итоговом swf-файле. Таким образом, общий объём кода, необходимый для исполнения flex-приложения, заметно увеличивается. В более поздних версиях флеш-плеера реализован механизм, который даёт возможность использовать классы flex, не включая их в каждый отдельный swf. При первом запуске такого swf, флеш-плеер подгрузит необходимые файлы с официального сайта в отведённый для этого кэш флеш-плеера. Однако, подгрузка дополнительных файлов из внешнего источника в некоторых случаях является неприемлемой или нежелательной. В этом случае, компоненты flex-framework должны быть скомпилированы и добавлены непосредственно в swf-файл, что заметно увеличивает размер swf-файла, если речь идёт о «легковесных» приложениях. [Источник 6]

Cкачивание Apache Flex

Пример

Вот пример приложения Flex 3, использующего MXML и ActionScript :

Этот код рисует форму, которая позволяет пользователю ввести свое имя, а затем вывести «Hello + [введенное имя]» при нажатии на кнопку «Dis Bonjour!».

Тот же пример с Flex 4 и с помощью компонентов Spark [2] :

Твердокаменный AJAX: защищаем веб-приложения

Содержание статьи

Год назад об AJAX
говорили как о новой перспективной технологии, но сегодня он как-то выпал из
поля зрения. Значит ли это, что AJAX не оправдал надежд и постепенно уходит в
историю? Нет и еще раз нет. AJAX – это технология back-end, реализация которой
перешла с прикладного уровня на уровень фреймворков.

Передовая линия обороны

Лежащие в основе огромного числа веб-проектов Dojo, Google Web Toolkit,
jQuery, Prototype, в свою очередь, являются дружественной к разработчику
реализацией AJAX. А задумывался ли ты о потенциальных брешах в безопасности,
прикручивая к своему проекту один из упомянутых фреймворков?

Если ты не хочешь отдать свой веб-проект на растерзание стае скрипт-киддисов,
то просто обязан знать об основной уязвимости AJAX-приложений. Эта уязвимость
носит архитектурный характер. Другими словами, полноценного решения проблемы не
существует и вряд ли когда-нибудь появится. Все, что ты можешь сделать – это
минимизировать риск возможного взлома, предприняв ряд целенаправленных действий.
Знакомься с мистером проблемой номер один – Hijacking!

Чтобы эффективно противодействовать этому виду атаки на AJAX-приложения,
неплохо было бы разобраться с тем, как эта ботва работает. Если говорить в двух
словах, то в основе AJAX лежит обмен сообщениями между сервером и клиентом
посредством JavaScript-сообщений. Hijacking нацелен на перехват таких сообщений
(в которых можно найти много вкусностей). Традиционный обмен сообщениями между
веб-клиентом и сервером лучше защищен от подобных атак благодаря технологии SOP
(Same Origin Policy). Какой-либо защиты сообщений, формируемых с помощью
JavaScript, пока не наблюдается. Кстати говоря, это должно быть головной болью
разработчиков веб-браузеров, но они просто игнорируют проблему. О том, что
проблема не нова, свидетельствует следующий факт: достаточно давно существует
еще одна реализация данной уязвимости, не имеющая никакого отношения к AJAX –
CSRF (Cross-site Request Foregery). Некоторые подробности, касающиеся CSRF, ты
найдешь в конце статьи. Здесь же только отметим, что применительно к JavaScript
проблема становится еще более серьезной, так как злоумышленник теперь может не
только изменять, но и читать передаваемые сообщения. Демонстрируя серьезность
проблемы, достаточно будет сказать, что впервые она была обнаружена ни
где-нибудь, а в самом Gmail.

Для защиты от атаки типа Hijacking запомни, прежде всего, простую, как
трехдюймовая дискета, истину – если веб-приложение надежно защищено от XSS, это
еще не говорит о его защите от Hijacking. Чтобы сделать AJAX-приложение
максимально непробиваемым, нужно, во-первых, сделать невозможным прямое
выполнение JS-ответа. Во-вторых, нужно организовать отсылку в известном
направлении всех кривых или просто подозрительных запросов. Начнем со второго
пункта. Для того чтобы спалить всех хитрозадых, достаточно будет использовать в
шаблоне запроса параметр, со слепым подбором которого могут возникнуть траблы. К
примеру, это может быть идентификатор сессии. Всякая ошибка в этом параметре
будет расцениваться как сигнал о попытке взлома. Если по каким-то причинам у
тебя нет возможности использовать параметры сессии, можно обойтись защитой на
стороне сервера, настроив его на обработку только POST-запросов. Фишка в том,
что задействованный при Hijacking тег

Adobe упростит разработку веб-приложений на основе AJAX и Flex

закрытое акционерное общество Adobe выпустила две библиотеки с открытым исходным кодом, которые должны упростить процесс разработки веб-приложений, одновременно использующих технологии Flex, Flash и AJAX. AJAX (Asynchronous JavaScript + XML — асинхронный JavaScript+XML) позволяет создавать веб-сайты, которые субъективно работают быстрее обычных. Ресурсы, построенные с применением технологии AJAX, позволяют выполнять многие действия без перезагрузки страницы. Это позволяет работать с веб-приложениями почти так же, как с традиционными программами. В настоящее время AJAX набирает всё большую и большую популярность среди разработчиков сайтов.

В свою очередь, Flex и Flash обладают рядом возможностей, которые отсутствуют у AJAX. В частности, поддерживаются работа с векторной графикой, кросс-доменный доступ к данным и прочее. Библиотеки Adobe как раз и должны установить своеобразный мост между Flex, Flash и AJAX.

Как сообщает eWeek со ссылкой на заявления Джеффа Уоткотта, одного из старших руководителей Adobe, библиотеки Flex-AJAX Bridge и AJAX Client for Flex Data Services должны не просто упростить процесс создания мультимедийных веб-приложений, но и существенно расширить их возможности. Демонстрация библиотек состоялась на конференции OReilly Emerging Technology Conference в Сан-Диего (штат Калифорния) 8 марта.

Adobe Flash и Flex, альтернатива AJAX?

Есть много сайтов, утверждающих, что Adobe Flash и Flex могут быть использованы в качестве альтернативы Ajax. Это правда. Flash используется для отображения видеоконтента на веб-странице, верно?
Как можно usd заменить ajax?

3 ответа

Javacript/ajax концептуально очень похож на ActionScript/Flash. (ActionScript — это язык программирования Flex.)

Actionscript — это строгий расширенный набор javascript с кучей дополнительных возможностей и дополнительных функций, которые делают людей, которые любят языки раннего связывания, удобными. (Как объявление типов переменных.)

Вместо запуска на виртуальной машине js в вашем браузере, например javascript, она запускается на виртуальной машине во Flash.

Вместо использования ajax для асинхронного взаимодействия с хостом в фоновом режиме, Adobe имеет свои очень похожие возможности.

Все это было очень удобно до того, как javascript/ajax распухли. И у него есть портативные библиотеки AIR VM для Windows, iOS и Linux, поэтому он может работать без размещения в браузере.

Хотя Adobe недооценивает эту технологию, потому что они видели, что будущее за HTML 5.

Есть много сайтов, утверждающих, что Adobe Flash и Flex могут быть использованы в качестве альтернативы Ajax. Я это правда.

Да, это правда. Flex — это пользовательский интерфейс для развития предприятия; он также использует среды выполнения Flash, что позволяет легко развертывать его на нескольких платформах, таких как приложения для настольных компьютеров (нацеленные на Flash Player), приложения на рабочем столе (нацеленные на Adobe AIR) и собственные мобильные приложения (с помощью Mobile AIR).

Flash используется для отображения видеоконтента на веб-странице, верно?

Может быть; но это не ограничивается этим. Сказать, что «Flash используется для отображения видеоконтента», все равно, что сказать «Джон Леннон был музыкантом» или «C++ может зацикливаться на структуре данных». Пока оба верны; но значительно упрощены и не передают всю широту возможностей.

Как это можно использовать для замены AJAX?

Flex — это UI Framework; поэтому он предлагает компоненты пользовательского интерфейса, встроенные в ActionScript (AKA The Language of Flash Player). У него есть механизм для настройки внешнего вида приложений. У него есть механизм связи с внутренними серверами. Это может помочь вам быстрее создавать приложения и обеспечить более согласованную работу в нескольких развертываниях.

Люди, с которыми я общаюсь, говорят, что корпоративные приложения, встроенные в решения HTML/JavaScript, занимают в 2-5 раз больше времени, чем решения Flex сегодня. Скорее всего, со временем ситуация изменится, поскольку инструменты и фреймворки улучшатся с точки зрения HTML/JavaScript.

Чтобы по-настоящему лучше понять Flex, вам следует прочитать документы или ознакомиться с серией видеороликов Adobe’s Flex in a Week.

Надеюсь, это дало объяснение, что такое Flex. Хотите ли вы изучать Flex сегодня или нет — это вопрос интерпретации. По моему скромному мнению, разработка Flash Player на основе браузера уйдет. Flex не поддерживается во многих мобильных браузерах (iOS и Windows Metro — два основных варианта); и это уменьшит выгоду от создания приложений Flash, предназначенных для браузера.

Я верю, что ВОЗДУХ будет продолжать процветать; так как он позволяет использовать Flex/ActionScript для создания настольных приложений и мобильных приложений. Adobe использует эту же технологию для создания своих сенсорных инструментов Creative Suite, таких как Photoshop Touch, поэтому мы можем быть уверены, что AIR не исчезнет в ближайшем будущем. Однако я ожидаю, что разработка AIR будет гораздо более нишевой, чем разработка Flash Player.

Добавить комментарий