Ajax в действии

showLoadinglmage: function() {

var newlmg = document.createElement('img1); newlmg.setAttrlbute('src', this.options.loadingImage ); document.getElementById( this.options.resultsContainerld).appendChild(newlmg);

},

0Сформировать URL операции поиска. URL операции поиска формируется

сиспользованием атрибута xmlURL, который был передан в момент создания с параметром q=, к которому присоединено значение, находящееся в текущий момент в поле поиска. Объединение (конкатенация) выполняется методом, проверяющим URL на существование предыдущей строки запроса (таким образом гарантируется использование правильных разделителей параметров).

appendToUrl: function(url, name, value) {

© Выполнить XSLT-обработку и обновить пользовательский интерфейс.

Поскольку мы предусмотрительно вынесли в отдельный метод задачу XSLT-обработки на стороне клиента, данная внешне сложная ответственность выполняется посредством единственной строки кода.

new XSLTHelper(searchUrl,

this.xsltURL).loadView(this.options.resultsContainerld);

О Обновить закладку. После того как пользователь инициировал поиск, необходимо обновить закладку. Данная ответственность выполняется с помощью метода updateBookmark().

Этот метод берет из объекта опций элемент container и текст закладки. URL сгенерированной закладки представляет собой значение, переданное конструктору в форме аргумента pageURL. К этому указателю добавляется параметр q= со значением текущего поиска. Согласно всем полученным значениям обновляется свойство innerHTML контейнера и получается соответствующий URL.

Если закладка была записана и использована для возврата на страницу, пользователь переходит на страницу с параметром q=someValue. Но что инициирует поиск, чтобы мы получили требуемый результат? Напомним, что в последней строке конструктора вызывался метод t h i s . i n i t i a l i z e ( ) ; . Мы

512 Часть IV. Ajax в примерах

еще не оговаривали, что этот метод делает, поэтому теперь самое время это уточнить. Как вы, возможно, догадались, метод i n i t i a l i z e () требуется для поддержки концепции закладки. Реализация этого метода выглядит следующим образом:

в строке запроса параметр q. Если он существует, метод выделяет значение параметра и передает его в поле поиска. Затем он инициирует поиск посредством метода doSearch (). Что и требовалось получить.

12.6.3. Выводы

Остановимся на мгновение и рассмотрим, чего же мы добились. Мы написали вспомогательный класс XSLTHelper, инкапсулирующий все тяжким трудом добытые знания по обеспечению поддержки XSLT в браузере клиента. Мы в полной мере использовали данный вспомогательный класс в компоненте 'живого" поиска. Мы написали простой, но настраиваемый компонент "живого" поиска, принимающий очень мало информации и превращающий Webстраницу пользователя в отзывчивое поисковое животное. При написании компонента мы придерживались классического объектно-ориентированного :тиля, иллюстрирующего простую структуру и разделение ответственности.

Вцелом совсем неплохо для одного дня работы.

12.7.Резюме

3 данной главе мы воспользовались обычной поисковой страницей и добашли в нее функциональные возможности Ajax. Главной особенностью напего поиска является то, что он не запрещает пользователю взаимодейство- !ать с окном во время выполнения обработки запроса на стороне сервера. Это означает, что в браузер можно, например, поместить анимацию. Налише контроля над браузером позволяет выполнять другие действия, так что ш можем быть уверенными, что пользователи приложения знают о том, что ЕОНСК выполняется.

Далее мы реализовали XSLT-обработку, превращающую наш документ i.ML в отформатированный HTML-код, который мы передаем свойству inегнтмь элемента div. Это позволяет отказаться от использования JavaScript ,ля динамической обработки узлов XML и создания большой строки, примеяемой к документу. Вместо этого в вопросе получения документа из XMLода мы можем положиться на XSLT.

То, что мы использовали анимацию в процессе обработки и XSLT при реализации "живого" поиска, совсем не означает, что эти концепции нельзя применить к другим проектам. Описанные возможности добавляются и к обычным транзакциям с сервером. Пользователи часто говорят, что какой-то процесс требует нескольких минут. Можем ли мы как-то показать подобное сообщение? Например, с помощью свойства innerHTML из данного проекта мы можем легко добавить на страницу сообщение или изображение, указывающее пользователю, что поиск выполняется. Вообще, практически в любом приложении Ajax следует указывать, что затребованное действие выполняется, чтобы пользователь не щелкал повторно на кнопке отправки или обновления.

С помощью XSLT можно задавать стиль сообщений RSS или изменять любой другой описанный в книге проект, используя на стороне клиента вместо циклического прохода DOM XML возможности XSLT.

В четырех примерах, приведенных в этой и предыдущих главах, мы реализовали собственные серверные процессы обслуживания наших клиентов Ajax. В последней главе мы изучим клиент Ajax, сообщающийся непосредственно со стандартной Web-службой: подачей новостей RSS.

Вэтой главе...

•Обработка RSS-лент

•Использование Ajax для непосредственного доступа к Web-сайтам

•Ajax без сервера

•Эффекты перехода

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

Многие Web-сайты предлагают ленты сообщений XML в форматах RSS (Really Simple Syndication — очень простой синдикат), RDF (Resource Descriptor Framework — каркас дескриптора ресурсов) и Atom — трех наиболее популярных лентах сообщений. Информация, содержащаяся в подобных наборах лент, может представлять собой ежедневные новости, комиксы, блоги, шутки, прогноз погоды и т.д. Благодаря Ajax мы можем получать объединенную информацию, не посещая все эти сайты и не покупая клиентское приложение, считывающее XML-ленты на наш компьютер.

В данной главе мы создадим собственное клиентское приложение чтения XML-лент, получающее ленты с различных Web-сайтов. Его можно будет запускать в браузере на любом компьютере, подключенном к Интернету.

13.1. Считывание информации из внешнего мира

Объединенная лента XML состоит из статей, которые можно свободно читать

иотображать на своих Web-сайтах. Хорошим примером объединенной ленты XML является блог. Следует отметить, что данные XML-ленты отличаются от старых добрых статей на Web-сайте, поскольку их можно совместно использовать и отображать во многих форматах. Это похоже на поиск газеты или журнала, точно соответствующих размерам стола, за которым вы завтракаете. Благодаря этому вы можете есть и читать, ничего не передвигая

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

Содержимое объединенных лент XML можно просматривать несколькими способами. Например, если данную задачу нужно решить для одного блога, мы можем зайти на Web-сайт, где расположена XML-лента. Чтобы одновременно просматривать несколько лент без обращения к нескольким сайтам, можно, например, воспользоваться узлами, подобными JavaCrawl.com. Кроме того, RSS-ленту можно просматривать в необработанном виде, непосредственно открывая исходный XML-файл в Web-браузере, или использовать специальное программное обеспечение для структурирования и форматирования лент, которые вам требуются.

Помимо перечисленных вариантов, для просмотра лент можно использовать Ajax. Без Ajax нам потребовалось бы загрузить клиентское приложение или зайти на Web-сайт, чтобы получить необходимую информацию, но благодаря Ajax нам этого делать не придется. Вместо этого мы разработаем RSS-клиент на основе JavaScript, который можно будет запустить прямо на

Рис, 13.1. Блог Эрика Паскарелло, предлагающий RSS-ленту

рабочем столе, используя только браузер. В данной главе мы создадим приложение, получающее несколько лент RSS из нескольких источников и позволяющее упорядоченно просматривать поступающую информацию. Кроме того, для улучшения привлекательности пользовательского интерфейса мы интегрируем в приложение эффекты переходов. Однако, прежде чем мы приступим к разработке приложения Ajax, необходимо разобраться в формате XML-ленты и понять, где эти ленты можно взять.

13.1.1. Поиск XML-лент

Одним из наиболее популярных мест для поиска XML-лент являются блоги. Нынешняя популярность блогов объясняется множеством причин. Они могут содержать различную информацию: личные записи, мысли, новости, шутки или обсуждение технологий. Рассмотрим один из примеров — блог Эрика Паскарелло, показанный на рис. 13.1.

Данный блог является доступным, т.е. зайти на него может кто угодно. Хотя многие пользователи просто читают информацию этого блога, находящегося на сайте JavaRanch, блог доступен и в виде XML-ленты. Для чтения этой ленты можно обратиться к ее "родной" XML-форме либо зайти на другой Web-сайт (например, JavaLobby), который получает объединенную ленту и отображает ее в собственном формате.

На рис. 13.1 в правом верхнем углу экрана видны ссылки на RSS, RDF и Atom. Как отмечалось ранее, данные форматы XML-лент являются наиболее распространенными.

Все указанные ленты имеют различные спецификации XML. Это означает, что, изучив соответствующие XML-файлы, мы обнаружим различные схе-

518 Часть IV. Ajax в примерах

Таблица 13.1. Необходимые элементы канала

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

Поскольку одним из наиболее популярных форматов лент является RSS (Really Simple Syndication — очень простой синдикат), далее мы будем изучать только RSS-ленты.

13.1.2. Изучение структуры RSS

Прежде чем приступить к разработке XML-клиента Ajax для чтения лент RSS, рассмотрим структуру RSS-файла. Знание структуры позволит более эффективно исследовать DOM XML и получить информацию, которую нам необходимо отобразить. Итак, документ RSS состоит из двух частей: канала и статей. Канал предоставляет информацию о том, откуда поступает лента; назначение статей понятно из названия.

Составляющие элементы канала

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

Данные три необходимых элемента предоставляют основную информацию о RSS-ленте. Они сообщают, откуда идет RSS-канал, как он называется и о чем он. Если нам понадобится другая информация о ленте, потребуется обратиться к дополнительным элементам.

Лента RSS может содержать любое число из указанных в табл. 13.2 дополнительных элементов канала. Разработчик ленты может не включать их в свой продукт, включить один, два или все шестнадцать.

Некоторые опции включают адреса электронной почты, которые потребуются при возникновении проблем, касающихся содержимого или структуры. Кроме того, имеется информация, объясняющая, когда обновляется лента.

Глава 13. Создание приложений Ajax, не использующих сервер 519

Таблица 13.2. Дополнительные элементы канала

520 Часть IV. Ajax в примерах

Необходимые и дополнительные элементы канала описывают содержимое RSS-ленты, позволяя нам определять ее характеристики. Подобно составляющим канала, составляющие статей также делятся на необходимые и необязательные.

Элементы статей

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

Кроме того, существует восемь дополнительных элементов, которые могут добавляться к статье. Возвращаясь к аналогии с печатной прессой, можно сказать, что в газетной статье обычно можно выделить такие элементы; материал, фамилия автора, источник и заголовок. Точно так же каждый элемент статьи в ленте RSS может содержать свои заголовки, имена авторов, источники и т.д. Все дополнительные элементы, которые может содержать статья, показаны в табл. 13.3.

Сердцем и душой ленты RSS являются заголовок и описание. Заголовок ( t i t i l e ) позволяет понять, о чем идет речь в статье, а описание (description) может представлять собой одно из двух: краткий конспект статьи или всю статью. В настоящее время не существует стандарта, определяющего, как должен использоваться элемент description. Чтобы определить, что же с ним делать, необходимо изучить каждую ленту, а лишь затем приступать к написанию RSS-клиента. Если это конспект — его можно сравнить с аннотацией на обложке журнала, в которой сказано: "подробности см. на с. 10". Вот именно здесь нам потребуется элемент link, представляющий собой URL всей статьи на сайте автора.

Большинство RSS-лент пытается использовать максимальное число дополнительных элементов, поскольку это помогает разработчикам (например, нам) создавать максимально надежные RSS-приложения. Чем больше данных предоставлено, тем лучше можно отобразить содержимое RSS-ленты. Подробнее о спецификации RSS рассказывается на сайте http://backend.userland.com/rss.

Разобравшись с основными элементами документа RSS, можно приступать к разработке собственного RSS-клиента на основе Ajax.

13.2. Богатый пользовательский интерфейс

В данной главе мы создадим программу просмотра RSS-лент, получающую ленты XML с Web-сайта без использования серверных технологий, подобных •NET или JSP, или клиентского приложения. Ajax позволяет просматривать информацию в виде Web-страницы, записанной на рабочем столе. Данный пример показывает, что инфраструктура Ajax не обязательно требует Webсервера, использующего технологию, подобную .NET или JSP. Если компью-

тер подключен к Интернету, мы можем обращаться к RSS-лентам любых выбранных сайтов. (Если вы пользуетесь браузером Mozilla, см. раздел 13.6.1. Прежде чем вы сможете использовать код, представленный в данном проекте, вам потребуется обойти ограничения безопасности Mozilla, рассмотренные в главе 7.)

13.2.1. Чтение лент

Если вам приходится ежедневно просматривать несколько Web-сайтов, с помощью нашего приложения вы сможете обойтись без этого утомительного процесса. Используя предлагаемую программу просмотра, вы получите необходимое число лент на одной странице.