Автор: Гвоздика Карнейро
Переводчик: simmone
Заявление об авторских правах: Любой веб-сайт, авторизованный Matrix, приперепечатке обязательно указывайте первоисточник и информацию об авторе статьи и этого заявления в виде гиперссылки. Автор: Cloves Carneiro;simmone.
Исходный адрес: http://www.javaworld.com/javaworld/jw-06-2005/jw-0620-dwr.html.
Китайский адрес: http://www.matrix.org.cn/resource/article/43/43926_DWR_AJAX.html.
Ключевые слова: DWR javascript :void(0);">AJAX
Обзор
В этой статье объясняется использование проектас открытым исходным кодом DWR (Direct Web Remoting) и концепции javascript :void(0);">AJAX (Asynchronous JavaScript and XML ) для повышения удобства использования веб-приложений. Автор показывает шаг за шагом. как DWR создает javascript :void(0);">Приложение AJAX простое и быстрое. (1600 слов; 20 июня 2005 г.)
javascript :void(0);">AJAX, или асинхронный JavaScript и XML, описываеттехнологию разработки, которая использует смесь HTML (или XHTML) и каскадных таблиц стилей для выражения информации для создания интерактивных веб-приложений;Объектная модель документа (DOM) ), JavaScript динамически отображает и взаимодействует с выраженной информацией, а объект XMLHttpRequest обменивается и обрабатывает данные асинхронно с веб-сервером;
Множество примеров в Интернете демонстрируют необходимые шаги для взаимодействия с сервером с использованием XMLHttpRequest внутри HTML-файла. При написании и поддержке кода XMLHttpRequest вручную разработчикам приходится иметь дело со многими потенциальными проблемами, особенно с такими проблемами, как совместимость реализации DOM в разных браузерах. Это приведет к тому, что придется потратить бесчисленное количество часов на кодирование и отладку кода Javascript, что явно недружелюбно по отношению к разработчикам.
Проект DWR (Direct Web Remoting) — это решение с открытым исходным кодом под лицензией Apache для разработчиков, которые хотят использовать javascript :void(0);">AJAX и XMLHttpRequest простым способом. Он имеет набор функций Javascript, упрощающихработу. метод вызова объектов Java на сервере приложений со страниц HTML. Он манипулирует различными типами параметров, сохраняя при этом читабельность HTML-кода.
DWR не является вставкой в проект и не заставляет объекты использовать какую-либо структуру наследования. Он хорошо работает с приложениями в рамках сервлетов. Для разработчиков, которым не хватает опыта программирования DHTML, DWR также предоставляет библиотеку JavaScript, которая содержит часто используемые задачи DHTML, такие как сборка таблиц, заполнение выбранных раскрывающихся списков элементами и изменение содержимого элементов HTML, таких как <div> и <span. . >
Веб-сайт DWR содержит подробную информацию и обширную документацию, которая легла в основу этой статьи. Приведено несколько примеров, показывающих, как используется DWR и какиеработы можно выполнять с его библиотеками.
Эта статья позволяет читателям увидеть, как шаг за шагом создается веб-приложение, использующее DWR. Я покажу вам необходимые детали для создания этого простого примера приложения, которое можно загрузить и развернуть в вашей среде, чтобы увидеть, как работает DWR.
ПРИМЕЧАНИЕ. Найти информацию о javascript :void(0);">AJAX несложно; в Интернете есть несколько статей и записей в блогах, посвященных этой теме, каждая из которых пытается указать и прокомментировать различные аспекты концепции. В разделе «Ресурсы» вы найдете несколько интересных ссылок на примеры и статьи, позволяющие узнать больше о javascript :void(0);">AJAX.
Пример приложения <BR>Пример приложения, используемый в этой статье, имитирует поисковую систему по аренде квартир в Торонто. Пользователи могут выбрать набор критериев поиска перед поиском. Чтобы улучшить интерактивность, javascript :void(0);">AJAX используется в следующих двух ситуациях:
·Приложение информирует пользователя, сколько результатов поиска будет возвращено на основе его выбора. Это число обновляется в режиме реального времени - с помощью javascript :void(0);">AJAX - когда изменяется количество спален и ванных комнат, выбранных пользователем, или диапазон цен. Когда нет или слишком много результатов поиска, соответствующих критериям , пользователю не нужно нажимать кнопку поиска.
· Запрос к базе данных и получение результатов выполняется с помощью javascript :void(0);">AJAX. Когда пользователь нажимает кнопку «Показать результаты», база данных выполняет поиск. Таким образом, приложение выглядит более отзывчивым, и все страницу не нужно перегружать для отображения результатов.
База данных <BR>Мы используем базу данных HSQL, представляющую собой механизм базы данных Java SQL, который занимает очень мало ресурсов и может быть объединен с веб-приложениями безустановки и настройки. Файл SQL используется для создания таблицы в памяти и добавления некоторых записей при запуске контекста веб-приложения.
Приложение класса Java <BR> содержит два основных класса, называемых Apartment и ApartmentDAO. Класс Apartment.java — это простой класс Java со свойствами и методами получения/установки. ApartmentDAO.java — это класс доступа к данным, используемый для запроса базы данных и возврата информации на основе критериев поиска пользователя. Реализация класса ApartmentDAO проста: он напрямую использует вызовы подключения к базе данных Java для получения общего количества квартир и списка доступных квартир, соответствующих запросу пользователя.
Конфигурация и использование DWR <BR>Настроить использование DWR очень просто: скопируйте jar-файл DWR в каталог WEB-INF/lib веб-приложения, добавьте объявление сервлета в web.xml и создайте файл конфигурации DWR. Для распространения DWR требуется отдельный jar-файл. Вы должны добавить сервлет DWR в раздел дескриптора развертывания в файле WEB-INF/web.xml вашего приложения.
<сервлет>
<имя-сервлета>dwr-invoker</имя-сервлета>
<display-name>Сервлет DWR</display-name>
<description>Сервлет Direct Web Remoter</description>
<servlet-class>uk.ltd.getahead.dwr.DWRSerlet</servlet-class>
<инициализирующий-параметр>
<param-name>отладка</param-name>
<param-value>истина</param-value>
</инит-парам>
</сервлет>
<сопоставление сервлетов>
<имя-сервлета>dwr-invoker</имя-сервлета>
<url-шаблон>/dwr/*</url-шаблон>
</сервлет-сопоставление>
Необязательный шаг — перевести DWR в режим отладки, как в примере выше, установив для параметра отладки значение true в разделе описания сервлета. Когда DWR находится в режиме отладки, вы можете увидеть все доступные объекты Java со страницы HTML. По URL-адресу /WEBAPP/dwr появится веб-страница со списком доступных объектов, на которой отображаются общедоступные методы объекта. Перечисленные методы можно вызывать со страницы, что позволяет вам впервые запускать методы для объектов на сервере. На следующем изображении показано, как выглядит страница отладки:
Страница отладки
Теперь вам нужно сообщить DWR, какой объект получит запрос через объект XMLHttpRequest. Эту задачу выполняет файл конфигурации dwr.xml. В файле конфигурации вы определяете объекты, которые DWR позволяет вызывать с веб-страницы. По своей конструкции DWR разрешает доступ ко всем общедоступным методам опубликованного класса, но в нашем случае мы разрешаем доступ только к нескольким методам. Вот файл конфигурации для нашего примера:
<двр>
<разрешить>
<convert Converter="bean" match="dwr.sample.Apartment"/>
<create Creator="new" javascript="ApartmentDAO" class="dwr.sample.ApartmentDAO">
<include метод="findApartments"/>
<include метод="countApartments"/>
</создать>
</разрешить>
</dwr>
В нашем примере приведенный выше файл достигает обеих целей. Во-первых, тег <convert> указывает DWR преобразовать тип объекта dwr.sample.Apartment в ассоциативный массив, поскольку по соображениям безопасности DWR по умолчанию не преобразует обычные bean-компоненты. Во-вторых, тег <create> позволяет DWR предоставлять класс dwr.sample.ApartmentDAO для вызовов JavaScript; файлы JavaScript, которые мы используем на странице, определяются атрибутом javascript. Мы должны обратить внимание на тег <include>, который указывает, какие методы класса dwr.sample.ApartmentDAO доступны.
После настройки кода HTML/JSP <BR> вы можете запустить свое веб-приложение. В это время DWR будет готов вызвать необходимые методы с вашей серверной страницы HTML или Java (JSP). В этом нет необходимости. Вы создаете файлы JavaScript. В файле search.jsp мы должны добавить интерфейс JavaScript, предоставляемый DWR, а также механизм DWR, и добавить в нашкод следующие три строки:
<script src='dwr/interface/ApartmentDAO.js'></ сценарий>
<script src='dwr/engine.js'></script>
<script src='dwr/util.js'></script>
Мы заметили, что когда пользователь меняет критерии поиска, это первое применение javascript :void(0);">AJAX в примере программы; как он видит, что количество доступных квартир обновляется при изменении критериев. Я создал две функции JavaScript: Функция ApartmentDAO.countApartments() — самая интересная часть — это первый параметр, функция loadTotal(), которая определяет метод JavaScript. DWR будет вызываться при получении ответа от сервера. Затем вызывается loadTotal для отображения результатов в <div> функций JavaScript, используемых в интерактивных сценариях:
function updateTotal() {.
$("resultTable").style.display = 'none';
var спальни = document.getElementById("спальни").value;
var ванные комнаты = document.getElementById("ванные комнаты").value;
var цена = document.getElementById("цена").value;
ApartmentDAO.countApartments(Общая нагрузка, спальни, ванные комнаты, цена);
}
функция loadTotal(данные) {
document.getElementById("totalRecords").innerHTML = данные;
}
Очевидно, что пользователь хочет видеть списки квартир, соответствующие его критериям поиска. Затем, когда пользователь удовлетворен критериями поиска и итоговые значения действительны, он нажимает кнопку, отображающую результаты, которая вызывает метод JavaScript updateResults():
функция updateResults() {
DWRUtil.removeAllRows("апартаменты");
var спальни = document.getElementById("спальни").value;
var ванные комнаты = document.getElementById("ванные комнаты").value;
var цена = document.getElementById("цена").value;
ApartmentDAO.findApartments(fillTable, спальни, ванные комнаты, цена);
$("resultTable").style.display = '';
}
функция fillTable(квартира) {
DWRUtil.addRows("apartmentsbody", apartment, [ getId, getAddress, getBedrooms, getBathrooms, getPrice ]);
}
Метод updateResults() очищает поле таблицы, в котором хранятся результаты поиска, получает необходимые параметры из пользовательского интерфейса и передает эти параметры объекту ApartmentDAO, созданному DWR. Затем будет выполнен запрос к базе данных и вызван метод fillTable(), который анализирует объект, возвращаемый DWR (апартаменты), и отображает его на странице (апартаменты).
Факторы безопасности <BR>Для краткости примера отметим, что класс ApartmentDAO сделан настолько простым, насколько это возможно, но такой класс обычно имеет набор заданных методов для управления данными, таких как Insert(), update() и delete(). DWR предоставляет все общедоступные методы, которые могут вызываться всеми HTML-страницами. Из соображений безопасности неразумно раскрывать такой уровень доступа к данным. Разработчики могут создать фасад, который централизует взаимодействие между всеми функциями JavaScript и базовыми бизнес-компонентами, тем самым ограничивая чрезмерное раскрытие функциональности.
Заключение <BR>Эта статья — только начало использования JavaScript на основе DWR :void(0);">AJAX в ваших проектах. DWR позволяет вам сосредоточиться на том, как улучшить модель взаимодействия вашего приложения. бремя написания и отладки кода JavaScript. Самая интересная задача с javascript :void(0);">AJAX — определить, где и как улучшить удобство использования. DWR отвечает за взаимодействие между веб-страницей и вашими Java-объектами, что помогает вам полностью сосредоточиться на том, как сделать пользовательский интерфейс вашего приложения более дружелюбным.
Я хотел бы поблагодарить Мирчу Оанчу и Маркоса Перейру, которые прочитали эту статью и дали очень ценные отзывы.
Ресурсы ·javaworld.com:javaworld.com
· Сообщество разработчиков Matrix-Java: http://www.matrix.org.cn/
·onjava.com:onjava.com
·Загрузите весь исходный код примера программы: http://www.javaworld.com/javaworld/jw-06-2005/dwr/jw-0620-dwr.war.
·DWR: http://www.getahead.ltd.uk/dwr/index.html.
·HSQL: http://hsqldb.sourceforge.net/
·javascript :void(0);">Определение AJAX: http://en.wikipedia.org/wiki/javascript :void(0);">AJAX
· «javascript :void(0);»>AJAX: новый путь к веб-приложениям»: Джесси Джеймс Гарретт (Adaptive Path, 2005.2): http://www.adaptivepath.com/publications/essays/archives/000385.php
· «Очень динамичный веб-интерфейс» Дрю Маклеллан (xml.com, 2005.2): http://www.xml.com/pub/a/2005/02/09/xml-http-request.html
·XMLHttpRequest и javascript:void(0);">Рабочий пример AJAX: http://www.fiftyfoureleven.com/resources/programming/xmlhttprequest/examples
· «Практика использования XMLHttpRequest» Томас Бекдал (Baekdal.com, 2005.3): http://www.baekdal.com/articles/Usability/usable-XMLHttpRequest/
· «Руководство по использованию XMLHttpRequest» Томас Бекдал (Baekdal.com, 2005.2): http://www.baekdal.com/articles/Usability/XMLHttpRequest-guidelines/