Ajax - асинхронный JavaScript + XML

Слово Ajax, которое является сокращением от «Asynchronous JavaScript + XML», было придумано Джесси Джеймсом Гарреттом и популяризировано в статье, опубликованной 18 февраля 2005 года, под названием Ajax: A New Approach to Web Applications, французский перевод которой был сделан .fr.

С момента публикации этой статьи использование техник, составляющих Ajax, и в частности объекта XMLHttpRequest, получило широкое распространение среди веб-мастеров. W3C также определил официальную спецификацию: XMLHttpRequest. Другим термином, который также стал популярным, является Web 2.0, основанный на Ajax, который относится к сайтам для совместной работы или сайтам, которые используют методы программирования для обеспечения взаимодействия с пользователем.
У « Аякса» есть два главных преимущества:

Динамические страницы: сочетание HTML и JavaScript позволяет создавать динамические страницы, внешний вид и содержимое которых изменяются в зависимости от взаимодействия с пользователем.
Например, нажатие кнопки может отобразить скрытые данные или изменить их порядок. Это было менее полезно в синхронной связи, так как новая страница отображалась целиком с каждым изменением.
При асинхронной связи повторно отображается только та часть страницы, которая изменилась.

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

Ajax стал обычным явлением с его интеграцией в JavaScript и HTML 5 фреймворки, и фактически интерес разработчиков сместился к HTML 5 и его новым тегам и сопутствующим API. Среди них WebSocket представляется преемником Ajax, так как является превосходным средством связи между приложением и сервером или бэкендом.

Что такое «Аякс» на практике ?

Ajax представляет собой комбинацию стандартных программных технологий:

Объект XMLHttpRequest может извлекать данные или отправлять их сценарию на сервере синхронно или асинхронно в соответствии со следующей схемой работы:

Ajax operating scheme,

Веб-страница включает в себя DOM, структуру документа, а ее представление определяется CSS. Он взаимодействует с сервером через объект XHR. Этот объект обменивается XML или текстовым содержимым. Операции выполняются с помощью кода JavaScript, который обращается к тегам страницы через DOM.

Синхронный через асинхронный

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

Как заставить «Аякс» работать?

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

Роль объекта XHR заключается в отправке запросов на сервер с помощью функции send. Методы HTTP GET и POST, а также другие, определяют характер запроса: GET для получения данных, POST для отправки данных (и получения результата). Метод HEAD позволяет узнать о природе файла на сервере.

Объект XHR позволяет получать файлы в текстовом формате, присвоенном атрибуту responseText, или в формате XML, присвоенном responseXML. Во втором случае доступ к контенту можно получить непосредственно с помощью методов DOM. Отсутствует атрибут responseHTML (фреймворк Anaa допускает его эмуляцию).

Спецификация XMLHttpRequest 2 поддерживает междоменные Ajax-запросы.

Чтение и отправка данных выполняется в соответствии с инструкциями, приведенными в руководстве Ajax Tutorial, в котором приведены примеры.

Использование инфраструктуры

Можно использовать JavaScript-фреймворк, интегрирующий Ajax, что облегчит чтение данных с сервера или отправку данных в скрипт.

Тенденция в сторону фреймворков HTML 5, которые предоставляют множество возможностей для сборки приложения и включают Ajax. Они чаще всего работают на мобильных и десктопных платформах .

Эволюция «Аякса»

Следует ли ограничивать слово Ajax определением, данным Дж. Дж. Гарреттом в 2005 году, или этот термин можно использовать для описания новых технологий создания динамических веб-приложений?

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

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

Фактически Ajax технологически обогнали новые протоколы вроде WebSocket, который позволяет осуществлять двунаправленную связь (сервер может сам отправлять данные), и WebRTC, который идет дальше, предлагая связь в реальном времени. Но это не значит, что Ajax устарел в практическом плане: очень часто его более чем достаточно для повышения удобства использования онлайн-приложения, зависящего от действий пользователя.

Сравнение XMLHttpRequest и WebSocket приведено в статье, в которой объясняется, как использовать объект XHR и WebSocket, а также преимущества двунаправленного режима перед простым асинхронным.