Javascript.RU

XMLHTTPRequest

Объект XMLHTTPRequest - низкоуровневая основа большинства AJAX-приложений. Знание его методов, свойств и особенностей не только помогает писать приложения на низком уровне с минимумом javascript-кода, но и позволяет понять, что происходит внутри фреймворков, которые, увы, часто несовершенны или тянут много лишнего.

Основные методы для посылки запросов XMLHttpRequest:

  • open(Method, Url, async)
  • send(data)
  • onreadystatechange

Правильная последовательность open/onreadystatechange/send:

req.open("GET", url, true)
req.onreadystatechange = handler
req.send(null)

Методы для манипуляции заголовками:

  • setRequestHeader()
  • getResponseHeader()
  • getAllResponseHeaders()

Обрыв соединения осуществляет метод

  • abort()

Ответ сервера находится в

  • responseText
  • responseXML
  • status
  • statusText

Причем responseXML заполняется только в случае, когда Content-Type с сервера имеет значение text/xml (кроме overrideMimeType-метода, но он есть только в Firefox).

Краткая сводка плюсов и минусов

  • Возможна синхронная передача (хотя и подвешивает браузер)
  • Полный контроль над заголовками
  • Можно отсылать документы из браузера в виде файлов, составляя POST-запрос вручную
  • В явном виде выдает ошибки коммуникации
  • Ограничение безопасности при помощи same origin policy
  • Невозможна отправка файлов, выбранных в форме
  • Утечки памяти при неправильном применении в старых IE

Пример небольшой функции getUrl, которая делает запросы:

function getXmlHttp(){
	try {
		return new ActiveXObject("Msxml2.XMLHTTP");
	} catch (e) {
		try {
			return new ActiveXObject("Microsoft.XMLHTTP");
		} catch (ee) {
		}
	}
	if (typeof XMLHttpRequest!='undefined') {
		return new XMLHttpRequest();
	}
}

// Получить данные с url и вызывать cb - коллбэк c ответом сервера 
function getUrl(http://javascript.ru/forum/url, cb) { 
	var xmlhttp = getXmlHttp();
	// IE кэширует XMLHttpRequest запросы, так что добавляем случайный параметр к URL
	// (хотя можно обойтись правильными заголовками на сервере)
	xmlhttp.open("GET", url+'?r='+Math.random());
	xmlhttp.onreadystatechange = function() {
		if (xmlhttp.readyState == 4) {
			cb(
			xmlhttp.status, 
			xmlhttp.getAllResponseHeaders(), 
			xmlhttp.responseText
			);
		}
	}
	xmlhttp.send(null);
}

Более подробно о свойствах и применении XMLHTTPRequest - на http://xmlhttprequest.ru


Автор: Павлик (не зарегистрирован), дата: 27 августа, 2008 - 18:04
#permalink

Замечательная статья!! Автору респект!


Автор: Гость (не зарегистрирован), дата: 2 октября, 2008 - 17:03
#permalink

Кстати, помнится читал о том, что можно посылать запросы и на др. сервера, но не каждый браузер это позволяет... правда это или нет?


Автор: orange, дата: 25 января, 2009 - 01:13
#permalink

если мне не изменяет память то это можно сделать, только если объект создан с использованием ActiveXObject, то есть в 5, 6 версии IE, а объект XMLHTTPRequest (то есть это все остальные браузеры, включая и IE 7>) не позволяет отправлять запросы на другие сервера - политика безопасности.
Если не прав - поправьте


Автор: Злата (не зарегистрирован), дата: 16 декабря, 2008 - 00:48
#permalink

естественно, почему бы и нет


Автор: Вадим (не зарегистрирован), дата: 16 января, 2009 - 16:53
#permalink

краткость сестра толанта, данный случай к коду.


Автор: Nikolas (не зарегистрирован), дата: 16 июня, 2009 - 22:58
#permalink

Вообще в ослине куча утечек памяти. Вот тут разбирался как с этим бороться: http://www.nik0las.ru/blog/2009/06/16/ajax_and_memory_leaks_at_ie.html


Автор: Илья Кантор, дата: 17 июня, 2009 - 08:34
#permalink

Какая версия IE ? Есть мнение, что с IE7 этой утечки нет, даже более того - возможно, на последнем IE6 ее тоже нет.


Автор: Nikolas (не зарегистрирован), дата: 17 июня, 2009 - 09:09
#permalink

На 6-м. На 7-м там уже есть нативный XMLHttpRequest.
Как обстоят дела с последним 6-м не знаю, тестил не на последнем.


Автор: Илья Кантор, дата: 17 июня, 2009 - 11:25
#permalink

На 6м IE вышел патч, вроде, в июне прошлого года, который эти мемлики исправил.

Соответственно, все компы, которые не обновляются вообще, имеют DOM/JS-мемлики.

А те, которые обновляются - по идее, наверно, уже IE8 поставили


Автор: B@rmaley.e><e (не зарегистрирован), дата: 22 сентября, 2009 - 17:43
#permalink

Контроль над заголовками далеко не полный. Попробуйте кроссбраузерно передать рефер.


Автор: bandolero, дата: 5 февраля, 2010 - 10:47
#permalink

Подсветка синтаксиса делает зеленым все, что следует за двумя слэшами (//). Поэтому в следующей строке все, что находится правее "http:", отображается зеленым цветом:
function getUrl(http://javascript.ru/forum/url, cb) {


Автор: HelpeR, дата: 10 марта, 2010 - 21:20
#permalink

Здравствуйте Илья Кантор. Хотел спросить на данный момент все браузеры (IE7, 8 FF2, 3, Opera 9, 10) сами автоматически удаляют XMLHttpRequest после получения данных с сервера и никакой утечки памяти не происходит?
И еще хотел спросить, не могли бы вы уточнить на счет этого (Можно отсылать документы из браузера в виде файлов, составляя POST-запрос вручную).
Заранее благодарен!


Автор: Илья Кантор, дата: 10 марта, 2010 - 23:48
#permalink

В общем, все почти ок с утечками. XMLHTTPRequest может формировать заголовки аналогичные тем, которые формирует браузер при посылке файла и тем самым пересылать как бы файл на сервер.


Отправить комментарий

Приветствуются комментарии:
  • Полезные.
  • Дополняющие прочитанное.
  • Вопросы по прочитанному. Именно по прочитанному, чтобы ответ на него помог другим разобраться в предмете статьи.
    Для остальных вопросов и обсуждений есть форум.
P.S. Лучшее "спасибо" - не комментарий, как все здорово, а рекомендация или ссылка на статью.
Содержание этого поля является приватным и не предназначено к показу.
  • Адреса страниц и электронной почты автоматически преобразуются в ссылки.
  • Разрешены HTML-таги: <strike> <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd> <u> <i> <b> <pre> <img> <abbr> <blockquote> <h1> <h2> <h3> <h4> <h5> <p> <div> <span> <sub> <sup>
  • Строки и параграфы переносятся автоматически.
  • Текстовые смайлы будут заменены на графические.

Подробнее о форматировании

CAPTCHA
Антиспам
14 + 3 =
Введите результат. Например, для 1+3, введите 4.
 
Текущий раздел
Поиск по сайту
Содержание

Учебник javascript

Основные элементы языка

Сундучок с инструментами

Интерфейсы

Все об AJAX

Оптимизация

Разное

Дерево всех статей

Статьи и мероприятия

Будьте в курсе наших последних новостей!

Ответьте, пожалуйста..
О чем бы вы хотели услышать на конференции по javascript?

На какие темы послушать доклады? Конференция состоится в середине мая.


Последние обсуждения на форуме
Forum
Последние комментарии