Что такое AJAX, правда? - PullRequest
Новая
       45

Что такое AJAX, правда?

19 голосов
/ 06 июня 2009

Я должен начать использовать AJAX в проекте, и я не знаю, с чего начать. Может кто-нибудь помочь, пожалуйста?

Ответы [ 22 ]

27 голосов
/ 06 июня 2009

A синхронный J avaScript A и X мл. Техника для достижения двунаправленной, управляемой сценариями связи между веб-браузерами и серверами через HTTP.

Смотри также:

Редактировать: Как указывает Носредна, JSON часто используется вместо XML.

18 голосов
/ 06 июня 2009

Грубая идея на английском:

У вас есть веб-страница. Происходит какое-то событие (может быть нажатие кнопки или другое событие формы, или просто что-то, запускаемое таймером) и запускает код JavaScript, который запрашивает у сервера свежую информацию (например, последнее значение акции GOOG).

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

Когда сервер отвечает, функция обратного вызова (которую вы указали при вызове JavaScript серверу) вызывается с информацией с сервера. Ваш код JavaScript использует информацию для обновления чего-либо - например, биржевой диаграммы GOOG.

15 голосов
/ 06 июня 2009

Не следует путать с cleaner , AJAX, технологическим термином , действительно описывающим структуру, или лучше сформулированным как метод использования XML и JavaScript для асинхронных вызовов код на стороне сервера ...

Вот несколько хороших примеров кода . И некоторые больше .

Хотя многие из приведенных выше примеров показывают, как создавать все объекты XML-запросов, если вы посмотрите на AJAX Control Toolkit от Microsoft для приложений ASP.NET или jQuery, вам будет проще с ними работать.

Образец jQuery (с сайта jQuery ):
при обращении к коду выполняется обращение к файлу some.php с передачей значений имени и местоположения. 

    <script type="javascript">
        function saveDataAjax(){ 
        $.ajax({
           type: "POST",
           url: "some.php",
           data: "name=John&location=Boston",
           success: function(msg){
             alert( "Data Saved: " + msg );
           }
         });
       }
   </script>
   <input type="submit" onClick="saveDataAjax();" value="submit" />
6 голосов
/ 06 июня 2009

Это модное слово, суть его:

Использование Javascript для создания асинхронного HTTP-запроса (в фоновом режиме) .

Когда приходит контент, выполняется действие, обычно выполняющее некоторую логику, а затем обновляющее внешний вид страницы путем манипулирования деревом DOM; значение, вставка новых элементов HTML, удаление некоторых элементов HTML и т. д.

X в AJAX обозначает XML, но это не имеет значения. XML - это просто один из множества способов форматирования данных, отправляемых сервером. JSON - намного лучшая альтернатива (IMNSHO). Также сервер может отправлять обычный текст или просто обычный html.

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

5 голосов
/ 06 июня 2009

Из Прагматического Аякса книга:

Что такое Ajax?

Аякс - зверь, которого трудно перегонять в один лайнер. Причина, по которой это так сложно потому что у него есть две стороны:

  • Ajax можно рассматривать как набор технологии.
  • Ajax можно просматривать как архитектура.

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

Название Ajax пришло из комплекта его стимулирующих технологий: асинхронный канал связи между браузером и сервером, JavaScript и XML. Когда это было было определено, что следующее:

  • Презентация на основе стандартов с использованием XHTML и CSS
  • Динамическое отображение и взаимодействие с использованием браузера DocumentObject Модель (DOM)
  • Обмен данными и манипулирование с использованием XML и XSLT
  • Асинхронный поиск данных с использованием XMLHttpRequest или XMLHTTP (из Microsoft)
  • JavaScript связывает все вместе

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

Именно по этим причинам более Важное определение для Ajax: ...

Аякс: Архитектура

Захватывающая эволюция Аякса в том, как вы разрабатываете веб-приложения. Давайте сначала посмотрим на обычные веб-архитектура:

  1. Определите страницу для каждого события в приложении: просмотр товаров, покупка предметы, проверка и т. д.
  2. Каждое событие или действие возвращает браузеру полную страницу.
  3. Эта страница отображается для пользователя.

Это кажется нам естественным. Это сделано смысл в начале Интернета, как Интернет не был на самом деле о Приложения. Сеть начиналась как больше хранилища документов; это было мир, в котором вы можете просто связать между документами специальным образом. Это был о документах и ​​обмене данными, не интерактивность в любом значимом смысл.

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

Ajax - это новая архитектура. важные части этой архитектуры являются:

  • Небольшие события на стороне сервера: Теперь компоненты в веб-приложении могут делать небольшие запросы обратно на сервер, получить некоторую информацию и настроить страница, которая просматривается путем изменения DOM. Нет полного обновления страницы.

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

  • onAnything: Мы можем взаимодействовать с сервером практически на всем пользователь делает. Ловушка для современных браузеров большинство тех же пользовательских событий, что и операционная система: мыши, мышь щелчки, нажатия клавиш и т. д. Любой пользователь событие может вызвать асинхронный запрос.

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

5 голосов
/ 06 июня 2009

Чаще всего это относится к использованию объекта XMLHttpRequest через JavaScript * в браузере.

В зависимости от того, кого вы спрашиваете, его можно использовать для описания практически любого типа взаимодействия клиент / сервер по HTTP, кроме простого ввода URL-адреса в браузере.

* jQuery предоставляет хороший код для обработки различий между браузерами и т. Д.

3 голосов
/ 06 июня 2009

http://www.w3schools.com/Ajax/Default.Asp

это хорошее место для начала. Это должно ответить на все ваши вопросы.

3 голосов
/ 06 июня 2009

Аякс - немного неправильный. Цитировать статью в вики:

Несмотря на название, использование JavaScript и XML на самом деле не требуется, и при этом запросы не должны быть асинхронным.

В то время как сейчас большинство людей называют «ajax» любым типом

веб-приложение, которое общается с сервером в фоновом режиме

2 голосов
/ 06 июня 2009

От человека, который придумал термин - http://adaptivepath.com/ideas/essays/archives/000385.php

2 голосов
/ 06 июня 2009

«Аякс» - это удачный маркетинговый термин, введенный еще в 2005 году, чтобы заменить более старый термин «DHTML», который не очень хорошо придерживался. «Аякс» сегодня тоже часть истории, так как появилось новое слово - «HTML5». Тем не менее, «HTML5» - это почти то же, что и оригинальный «DHTML».

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

Надеюсь, это прояснится.

Страница:
...