ТЕХНОЛОГИЯ AJAX

Содержание

Введение

Для создания своего форума  я решила использовать технологию Ajax как наиболее актуальную, и в настоящее время получившую наибольшее распространение .

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

1.     Технология Ajax

1.1.          Что такое AJAX

AJAX, Ajax (ˈeɪdʒæks, от англ. Asynchronous Javascript and XML — «асинхронный JavaScript и XML») — подход к построению интерактивных пользовательских интерфейсов веб-приложений, заключающийся в «фоновом» обмене данными браузера с веб-сервером. В результате, при обновлении данных веб-страница не перезагружается полностью, и веб-приложения становятся более быстрыми и удобными.

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

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

·        с использованием XMLHttpRequest (основной объект);

·        через динамическое создание дочерних фреймов;

·        через динамическое создание тега <script>^;

·            через динамическое создание тега <img>, как это реализовано в google analytics.

·            использование DHTML для динамического изменения содержания страницы;

В качестве формата передачи данных могут использоваться фрагменты простого текста, HTML-кода, JSON или XML.

1.2.          История AJAX

Впервые термин AJAX был публично использован 18 февраля 2005 года в статье Джесси Джеймса Гарретта (Jesse James Garrett) «Новый подход к веб-приложениям». Гарретт придумал термин, когда ему пришлось как-то назвать новый набор технологий, предлагаемый им клиенту. Однако в той или иной форме многие технологии были доступны и использовались гораздо раньше, например в подходе «Remote Scripting», предложенном компанией Microsoft в 1998 году, или с использованием HTML элемента IFRAME, появившегося в Internet Explorer 3 в 1996 году.

AJAX стал особенно популярен после использования его компанией Google в сервисах Gmail, Google Maps и Google Suggest.

1.3.          Преимущества Ajax

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

Если вы работаете с Java или .NET, средства поддержки сеанса на сервере доступны, подобно запросам ответам и MIME-типам, посредством стандартного API.

Когда пользователь регистрируется или другим способом инициализирует сеанс, создается несколько объектов на стороне сервера. Они представляют, например, "корзинку" покупателя или платежную карточку пользователя. Одновременно браузер получает исходную страницу. Она доставляется в виде потока HTML-данных, которые представляют собой сочетание стандартных элементов и данных, специфических для конкретного пользователя. При каждом обращении к серверу браузер получает очередную страницу, содержащую данные тех же типов, что в предыдущих документах. Браузер исправно убирает с экрана старый документ и отображает новый. Других действий от него и не следует ожидать: это низкоуровневая программа, которая делает только то, что было предусмотрено разработчиками. Когда пользователь активизирует ссылку, соответствующую окончанию сеанса, или закрывает браузер, выполнение приложения завершается и сеанс разрушается. Информация, которую пользователь должен увидеть при следующей регистрации, заносится в долговременное хранилище. В Ajax - приложении часть прикладной логики переносится на браузер.

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

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

Поскольку документ присутствует на стороне клиента в течение всего сеанса, он способен хранить информацию о его состоянии. Например, сведения о состоянии "корзинки" покупателя могут храниться не на сервере, а в клиентской программе.

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

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

Трафик при работе Ajax-приложениями, сначала возрастает так как при регистрации пользователя клиентской программе доставляется сложное приложение. Дальнейшее взаимодействие с сервером становится гораздо более эффективным.

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

В Web-браузере предусмотрены два основных механизма ввода данных: гипертекстовые ссылки и HTML-формы. Гипертекстовые ссылки могут быть сформированы на сервере и снабжены параметрами CGI (Common Gateway Interface — интерфейс общего шлюза). Их можно оформить как изображения и средствами CSS (Cascading Style Sheets — каскадные таблицы стилей) организовать обратную связь с пользователями, например, обеспечить изменение внешнего вида при наведении на них курсора мыши. Хороший Web-дизайнер при желании добьется того, что ссылки будут выглядеть как полноправные компоненты пользовательского интерфейса.

Формы могут содержать многие компоненты, типичные для пользовательского интерфейса обычных приложений, а именно: поля редактирования, флажки и переключатели опций, раскрывающиеся списки и пр. Однако некоторые из компонентов в составе форм не поддерживаются. Так, например, в формах не предусмотрены деревья и таблицы. Формы, как и гипертекстовые ссылки, содержат URL, указывающие на ресурсы сервера. Гипертекстовые ссылки и формы могут также указывать на функции JavaScript. В традиционных Web-документах часто можно встретить JavaScript - сценарии, проверяющие корректность заполнения форм. Они следят за незаполненными полями, значениями, выходящими за пределы допустимого диапазона, и другими подобными ошибками. Передача данных на сервер происходит лишь в том случае, если форма заполнена корректно. JavaScript-функции присутствуют на стороне клиента в течение того же времени, что и содержащая их Web-страница.

При обращении к очередной странице пользователю приходится на время прервать работу. Предыдущий документ еще некоторое время отображается на экране; некоторые браузеры даже позволяют активизировать какую-либо из видимых ссылок, но результаты предсказать невозможно. Скорее всего, пользователь, поступивший подобным образом, разрушит информацию о сеансе, поддерживаемую на сервере. После получения новой страницы пользователю предоставляются приблизительно те же возможности выбора, которые он имел до этого. Например, добавление в "корзинку" товара, скажем, брюк, вряд ли приведет к переходу от категории "мужская одежда" к категории "женская одежда" или "детская одежда". Представим себе теперь, как ведет себя "корзинка" покупателя, реализованная в составе Ajax-приложения. Поскольку Ajax позволяет передавать данные в асинхронном режиме, пользователь может добавлять товар в "корзинку" с той же скоростью, с которой он щелкает мышью. Если клиентская часть приложения выполнена профессионально, она без труда справится с данной задачей, и пользователю не придется в своей работе учитывать специфику взаимодействия программы и сервера. Очевидно, что реальной "корзинки" не существует; она выполнена в виде объекта поддержки сеанса на сервере. Однако пользователь, который делает покупки, не должен ничего знать об объекте сеанса. "Корзинка" — это понятие, позволяющее упрощенно представить выполняемые действия. Необходимость переходить от понятия "корзинка" к объектам, содержащимся в памяти компьютера, создает дискомфорт для пользователя. Необходимость ожидать обновления страницы принуждает вернуться из виртуального мира в реальный. Приложение, реализованное средствами Ajax, свободно от этого недостатка. Приобретать товары в сетевом магазине пользователям приходится лишь время от времени, однако в других областях деятельности, например, при решении сложных инженерных задач, поминутное прерывание работы, связанное с необходимостью ожидать появления очередной страницы, недопустимо.

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

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

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

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

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

Ajax уже используется для создания реальных приложений, и преимущества данного подхода видны на практике.

1.4.          Недостатки AJAX

1.     Отсутствие интеграции со стандартными инструментами браузера 

2.     Динамически создаваемые страницы не регистрируются браузером в истории посещения страниц, поэтому не работает кнопка «Назад», предоставляющая пользователям возможность вернуться к просмотренным ранее страницам, но существуют скрипты, которые могут решить эту проблему.

3.     Другой недостаток изменения содержимого страницы при постоянном URL заключается в невозможности сохранения закладки на желаемый материал. Проблему можно успешно решить с помощью History.pushState.

4.     Динамически загружаемое содержимое недоступно поисковикам (если не проверять запрос, обычный он или XMLHttpRequest) 

5.     Поисковые машины не могут выполнять JavaScript, поэтому разработчики должны позаботиться об альтернативных способах доступа к содержимому сайта.

6.     Старые методы учёта статистики сайтов становятся неактуальными 

7.     Многие сервисы статистики ведут учёт просмотров новых страниц сайта. Для сайтов, страницы которых широко используют AJAX, такая статистика теряет актуальность.

8.     Усложнение проекта 

9.     Перераспределяется логика обработки данных — происходит выделение и частичный перенос на сторону клиента процессов первичного форматирования данных. Это усложняет контроль целостности форматов и типов. Конечный эффект технологии может быть нивелирован необоснованным ростом затрат на кодирование и управление проектом, а также риском снижения доступности сервиса для конечных пользователей.

10.  Требуется включенный JavaScript в браузере 

11.  JavaScript может быть выключен из соображений безопасности. И, конечно же, AJAX-страницы труднодоступны не полнофункциональным браузерам, роботам и веб-архивам.

1.5.          Системы, созданные с использованием Ajax

Наибольший вклад в формирование современного представления об Ajax - приложениях внесла компания Google. (Она использовала данную технологию еще до того, как та получила имя Ajax.) Бета-версия службы GMail стала доступна в начале 2004 года. Эта служба привлекла внимание пользователей не только размерами предоставляемого им почтового ящика, но и интерфейсом, который позволял одновременно открывать несколько сообщений и автоматически обновлял список корреспонденции, даже если пользователь подготавливал в это время новое сообщение. Это был существенный шаг вперед по сравнению с обычными почтовыми системами, предлагаемыми большинством провайдеров. Сравнивая GMail с Web-интерфейсами корпоративных почтовых серверов, например Microsoft Outlook и Lotus Notes, нетрудно заметить, что GMail обеспечивает большинство функций, не прибегая к помощи тяжеловесных и ненадежных элементов ActiveX или Java-аплетов. В результате служба доступна не только для корпоративных пользователей, вооруженных специально настроенными машинами, но и для большинства обычных систем.

За GMail последовали другие интерактивные службы, например, Google Suggest, поисковый сервер которой автоматически предлагает завершение фразы, указываемой в составе запроса, и Google Maps — интерактивная масштабируемая карта, посредством которой определяется расположение ресурса. Начали эксперименты с данной технологией и другие компании. В качестве примера можно привести интерактивную систему Flickr, которая в настоящее время является составной частью Yahoo!.

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

Наличие приложений, созданных на базе Ajax, свидетельствует о том, что новый подход получает признание разработчиков. Если отдельные программисты иногда используют новую технологию лишь для того, чтобы ознакомиться с ней, то такие компании, как Google и Yahoo!, прибегают к ней только в том случае, если она сулит выигрыш в конкурентной борьбе.

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

1.6.          Базовые технологии Ajax

Ajax — не одна конкретная технология, скорее это совокупность четырех технологий, дополняющих друг друга(таблица1).

Сложные Ajax-приложения доставляются пользователям и как пользователи взаимодействуют с ними за счет использования JavaScript-кода, который "объединяет" приложение, определяет последовательность действий пользователя и бизнес-логику программы. Действия с интерфейсом преобразуются в операции с элементами DOM (Document Object Model), с помощью которых обрабатываются данные, доступные пользователю, в результате чего представление их изменяется. Здесь же производится обработка перемещений и щелчков мышью, а также нажатий клавиш. Каскадные таблицы стилей, или CSS (Cascading Style Sheets), обеспечивают согласованный внешний вид элементов приложения и упрощают обращение к DOM-объектам. Объект XMLHttpRequest (или подобные механизмы) используется для асинхронного взаимодействия с сервером, обработки запросов пользователя и загрузки в процессе работы необходимых данных. Три из этих четырех технологий — CSS, DOM и JavaScript — составляют DHTML (Dynamic HTML). Следует заметить, что средства DHTML, появившиеся в 1997 году, подавали большие надежды, но так и не оправдали их. DHTML позволяет создавать на базе Web-страниц интерфейсы с достаточно большими интерактивными возможностями, но любые изменения внешнего вида страницы реализуются лишь путем повторной загрузки всего документа. Набор действий, которые можно выполнить без обращения к серверу, весьма ограничен. Средства DHTML интенсивно используются в Ajax, но благодаря асинхронным запросам можно получить результаты, которые невозможно получить с помощью обычных Web-страниц.

Таблица 1. Базовые технологии Ajax

Очень важно, что средства поддержки всех рассматриваемых здесь технологий уже присутствуют в большинстве современных браузеров, включая Microsoft Internet Explorer, семейство Mozilla/Gecko, Firefox, Mozilla Suite, Netscape Navigator, Camino, Opera, Apple Safari и Konqueror (который ориентирован на выполнение в среде Unix KDE). К сожалению, конкретные реализации этих технологий в разных браузерах различаются рядом важных деталей, более того, различия встречаются даже в разных версиях одного продукта. Правда, за последние пять лет положение дел несколько улучшилось, и разработаны способы, позволяющие справиться с несовместимостью браузеров.

В составе каждой современной операционной системы имеется браузер. Таким образом, подавляющее большинство настольных и портативных компьютеров уже готово для запуска Ajax-приложений. Разработчики программ на базе Java или .NET могут лишь мечтать об этом. Браузеры для КПК и мобильных телефонов обычно имеют усеченный набор возможностей и не поддерживают полный набор Ajax-технологий. Следует заметить, что если бы средства поддержки Ajax и имелись в наличии, все равно размеры экрана и особенности ввода данных создавали бы существенные проблемы при работе с Ajax-приложениями. На сегодняшний день инфраструктура Ajax ориентирована лишь на настольные и портативные компьютеры.

2.     Что такое форум

Форум – это тематическое общение. В отличие от чата, на форуме обсуждают какую-то определенную тему. Можно сказать, что форум – это клуб по интересам. То есть форум – это такое место в Интернете, где собираются люди, которых объединяет одно увлечение или идея, и общаются на интересующую их тему. Они помогают друг другу советами и подсказками, обмениваются жизненным опытом, поддерживают друг друга.

Например, я увлекаюсь компьютерной графикой. В Интернете много книг и статей на интересующую меня тему, но все равно время от времени я сталкиваюсь с трудностями. Что-то непонятно, где-то не получается – без посторонней помощи не обойтись. Здорово, когда есть кто-то, у кого можно спросить, но если такого человека нет? И вот тут на помощь приходят форумы. Я нахожу форум или несколько форумов на интересующую меня тему, регистрируюсь и начинаю общаться с единомышленниками. Где-то они мне помогут-подскажут, где-то я им. Да и вообще, приятно общаться с людьми, которые тебя понимают.

В отличие от чата, на форуме Вы не получите ответ мгновенно. Ответ на заданный Вами вопрос Вы можете получить через день-два.

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

Очень часто форум – это часть какого-то сайта. Например, на сайте Neumeka.ru есть компьютерный форум, на котором посетители сайта могут встретиться, обсудить интересующие их темы, спросить совета или попросить помощи.

Для того чтобы найти форум на интересующую тему, можно воспользоваться поисковой системой. Например, открыть сайт yandex.ru и напечатать в оранжевой строке поиска «форум интересующая тема». Например, «форум кошки».

Форум (forum) – это англоязычное слово, которое в буквальном переводе обозначает «свободная дискуссия» или конференция. В интернет-терминологии под данным понятием подразумевают специально созданный раздел сайта, который предназначен для общения постоянных пользователей сайта или людей, зашедших на него в поиске конкретной информации. Темы, обсуждаемые на форуме, могут полностью соответствовать тематике сайта, а могут отличаться от нее и затрагивать несколько другие сферы.

Регистрация и активность на форуме

Создание и развитие тем соответствует установленным правилам поведения, с которыми можно ознакомиться при регистрации. Регистрация – процесс предоставления и учета личных данных: e-mail адрес, имя и т.д. Регистрация выполняется в течение нескольких минут и дает возможность использовать все функции форума в полном объеме: создание новых тем, чтение и отправка личных сообщений и т.д. После регистрации для входа на форум требуется авторизация. Для ее выполнения необходимо воспользоваться формой входа – специальная вкладка. В форму вводятся, заявленные при регистрации, имя и пароль. Нужно отметить, что после регистрации на указанный человеком e-mail адрес отправляется письмо (созданное автоматически), которое содержит регистрационные данные и специальную ссылку при переходе по которой подтверждается регистрация.

Понятие форум можно определить, как клуб по интересам. Один из пользователей сайта, которого впоследствии называют ТС (Topic starter в переводе тема создатель) в виде текстового сообщения размещает свой личный взгляд на определенные вопросы или делится конкретной информацией или задает вопрос. Другие зарегистрированные пользователи отвечают на сообщение (на некоторых форумах добавлять ответы возможно и без предварительной регистрации). Причем ответы могут быть весьма разнообразные, как поддерживающие ТС, так и выражающие противоположную точку зрения. По сути, ведется дискуссия в письменной форме.

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

Темы (топики) и ответы на них сохраняются на форуме достаточно длительное время (удаляются по решению администратора). Добавлять ответы можно не только в день создания, а и в любое другое время. Это и есть основное отличие форума от чата, где люди обмениваются практически мгновенными сообщениями. Второе отличие в том, что все сообщения – ответы объединяются в треды (thread в переводе с англ. нить) и привязаны к исходному сообщению – теме, которое и послужило началом дискуссии.

Темы, как правило, объединены по смыслу в различные разделы. То есть структуру можно представить следующим образом:

Раздел сайта – конференция, которая включает в себя тематические разделы. Разделы включают в себя форумы, посвященные определенной теме. Форум непосредственно содержит темы (топики), которые состоят из сообщений пользователей. Такая структура называется древовидной.

3.     Практическая работа

Заключение

Список литературы

1.       Б. Маклафлин. Изучаем Ajax = Head Rush Ajax. — СПб.: Питер, 2007. — ISBN 978-5-91180-322-3

2.       Стивен Хольцнер. Ajax Библия программиста = Ajax Bible. — М.: Диалектика, 2009. — С. 553. — ISBN 978-5-8459-1502-3

3.       Дейв Крейн, Бер Бибо, Джордон Сонневельд. Ajax на практике = Ajax in Practice. — М.: Вильямс, 2007. — ISBN 978-5-8459-1327-2

4.       Дэниел Вулстон. Ajax и платформа .NET 2.0 для профессионалов = Pro Ajax and the .NET 2.0 Platform. — М.: Вильямс, 2007. — С. 464. — ISBN 1-59059-670-6

5.       Дейв Крейн, Эрик Паскарелло, Даррен Джеймс. AJAX в действии: технология — Asynchronous JavaScript and XML = Ajax in Action. — М.: Вильямс, 2006. — С. 640. — ISBN 1-932394-61-3

6.       Ajax и PHP: Разработка динамических веб-приложений

7.        

Скачано с www.znanio.ru