XMLHttpRequest | это... Что такое XMLHttpRequest? (original) (raw)

XMLHttpRequest (XMLHTTP, XHR) — API, доступное в скриптовых языках браузеров, таких как JavaScript. Использует запросы HTTP или HTTPS напрямую к веб-серверу и загружает данные ответа сервера напрямую в вызывающий скрипт.[1] Информация может передаваться в любом текстовом формате, например, в XML, HTML или JSON. Позволяет осуществлять HTTP-запросы к серверу без перезагрузки страницы.

XMLHTTP является важной составляющей технологии AJAX (Asynchronous JavaScript And XML), используется многими сайтами для создания динамичных, быстро реагирующих на запросы пользователя приложений. Например XMLHTTP используется такими сайтами, как Bing Maps, Gmail, Google Maps, Google Suggest, Facebook. XMLHTTP работает только с файлами, находящимися на том же домене, что и использующая XMLHTTP страница, но существует возможность обойти ограничение. Как и в случае JavaScript, это сделано в целях безопасности (cross-site scripting).

Хотя в названии присутствует аббревиатура XML, технология не накладывает ограничений на формат передаваемых данных. Данные можно пересылать как в виде XML, так и в JSON, HTML или просто неструктурированным текстом. Разработчик может самостоятельно создать формат для передачи данных. Однако нужно учитывать, что при пересылке используется текстовый протокол HTTP и потому при использовании метода GET данные должны передаваться в виде текста (то есть бинарные данные следует кодировать, к примеру в base64). При использовании метода POST в кодировании нет необходимости.

Содержание

История

Впервые был разработан компанией Microsoft, появившись в компоненте Outlook Web Access программного продукта Microsoft Exchange Server 2000. Он был назван IXMLHTTPRequest. Позднее, наработки были включены в состав MSXML 2.0 в виде объекта ActiveX, доступного через JScript, VBScript или другие скриптовые языки, поддерживающиеся браузером. MSXML 2.0 был включён в состав браузера Internet Explorer 5.

Программисты проекта Mozilla затем разработали совместимую версию, называющуюся nsIXMLHttpRequest в Mozilla 0.6. Доступ к компоненту был реализован через JavaScript-объект, названный XMLHttpRequest. Однако, полной функциональности удалось добиться только в Mozilla 1.0. В дальнейшем поддержка XMLHttpRequest появилась в браузерах Safari 1.2, Opera 8.01 и в других.

Последняя официальная спецификация — версия 1.0 (XMLHttpRequest Version 1.0 от 3 августа 2010 года), которая имеет статус кандидата в рекомендации (Candidate Recommendation) и версия 2.0 (XMLHttpRequest Level 2 от 7 сентября 2010 года), имеющая статус черновика. Во второй версии вводятся обработчики событий прогресса, поддержка кросс-доменных запросов и работа с бинарными данными.[2]

Методы класса XMLHttpRequest

Метод Описание
abort() Отменяет текущий запрос, удаляет все заголовки, ставит текст ответа сервера в null.
getAllResponseHeaders() Возвращает полный список HTTP-заголовков в виде строки. Заголовки разделяются знаками переноса (CR+LF).Если флаг ошибки равен true, возвращает пустую строку.Если статус 0 или 1, вызывает ошибку INVALID_STATE_ERR.
getResponseHeader(headerName) Возвращает значение указанного заголовка.Если флаг ошибки равен true, возвращает null.Если заголовок не найден, возвращает null.Если статус 0 или 1, вызывает ошибку INVALID_STATE_ERR.
open(method, URL, async, userName, password) Определяет метод, URL и другие опциональные параметры запроса;параметр async определяет, происходит ли работа в асинхронном режиме.Последние два параметра необязательны.
send(content) Отправляет запрос на сервер.
setRequestHeader(label, value) Добавляет HTTP-заголовок к запросу.
overrideMimeType(mimeType) Позволяет указать mime-type документа, если сервер его не передал или передал неправильно. Внимание: метод отсутствует в Internet Explorer!

Свойства класса XMLHttpRequest

Свойство Тип Описание
onreadystatechange EventListener Обработчик события, которое происходит при каждой смене состояния объекта. Имя должно быть записано в нижнем регистре.
readyState unsigned short Текущее состояние объекта (0 — не инициализирован, 1 — открыт, 2 — отправка данных, 3 — получение данных и 4 — данные загружены)
responseText DOMString Текст ответа на запрос.Если состояние не 3 или 4, возвращает пустую строку.
responseXML Document Текст ответа на запрос в виде XML, который затем может быть обработан посредством DOM.Если состояние не 4, возвращает null.
status unsigned short HTTP-статус в виде числа (404 — «Not Found», 200 — «OK» и т. д.)
statusText DOMString Статус в виде строки («Not Found», «OK» и т. д.).Если статус не распознан, браузер пользователя должен вызвать ошибку INVALID_STATE_ERR.

Ошибки, вызываемые классом XMLHttpRequest

Название Код Описание
SECURITY_ERR 18 Вызывается при попытке совершить запрос, запрещённый настройками безопасности в браузере пользователя.
NETWORK_ERR 101 Вызывается при ошибке сети (во время синхронного запроса).
ABORT_ERR 102 Вызывается при прерывании пользователем запроса (во время синхронного запроса).

Пример использования

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

  1. Создание экземпляра объекта XMLHttpRequest
  2. Открытие соединения
  3. Установка обработчика события (нужно делать после открытия и до отправки в IE)
  4. Отправка запроса.

Создание экземпляра объекта XMLHttpRequest.

На этой стадии необходима отдельная реализация для разных браузеров. Конструкция создания объекта отличается: в IE 5 — IE 6 она реализована через ActiveXObject, а в остальных браузерах (IE 7 и выше, Mozilla, Opera, Chrome, Netscape и Safari) — как встроенный объект типа XMLHttpRequest.

Вызов для ранних версий Internet Explorer выглядит так[3]:

var req = new ActiveXObject("Microsoft.XMLHTTP");

В остальных браузерах:

var req = new XMLHttpRequest();

То есть, для обеспечения кросс-браузерности кода, нужно лишь проверять наличие объектов window.XMLHttpRequest и window.ActiveXObject, и, в зависимости от того, какой есть, тот и применять.

В качестве универсального решения предлагается использование такой функции:

function createRequestObject() { if (typeof XMLHttpRequest === 'undefined') { XMLHttpRequest = function() { try { return new ActiveXObject("Msxml2.XMLHTTP.6.0"); } catch(e) {} try { return new ActiveXObject("Msxml2.XMLHTTP.3.0"); } catch(e) {} try { return new ActiveXObject("Msxml2.XMLHTTP"); } catch(e) {} try { return new ActiveXObject("Microsoft.XMLHTTP"); } catch(e) {} throw new Error("This browser does not support XMLHttpRequest."); }; } return new XMLHttpRequest(); }

Установка обработчика событий, открытие соединения и отправка запросов

Эти вызовы выглядят так:

req.open(<"GET"|"POST"|...>, [, [, , ]]); req.onreadystatechange = processReqChange;

Где:

После определения всех параметров запроса его остается только отправить. Делается это методом send(). При отправке GET-запроса для версии без ActiveX необходимо указать параметр null, в остальных случаях можно не указывать никаких параметров. Не будет ошибкой, если для GET всегда будет указан параметр null:

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

var req;

function loadXMLDoc(url) { req = null; if (window.XMLHttpRequest) { try { req = new XMLHttpRequest(); } catch (e){} } else if (window.ActiveXObject) { try { req = new ActiveXObject('Msxml2.XMLHTTP'); } catch (e){ try { req = new ActiveXObject('Microsoft.XMLHTTP'); } catch (e){} } }

if (req) {       
    req.open("GET", url, true);
    req.onreadystatechange = processReqChange;
    req.send(null);
}

}

function processReqChange() { try { // Важно! // только при состоянии "complete" if (req.readyState == 4) { // для статуса "OK" if (req.status == 200) { // обработка ответа } else { alert("Не удалось получить данные:\n" + req.statusText); } } } catch( e ) { // alert('Ошибка: ' + e.description); // В связи с багом XMLHttpRequest в Firefox приходится отлавливать ошибку // Bugzilla Bug 238559 XMLHttpRequest needs a way to report networking errors // https://bugzilla.mozilla.org/show_bug.cgi?id=238559 } }

Известные проблемы

Проблема с кешированием в Microsoft Internet Explorer

Internet Explorer кеширует GET-запросы. Те авторы, которые не знакомы с кешированием HTTP, ожидают, что GET-запросы не кешируются, или что кеш может быть обойдён, как в случае нажатия кнопки обновления. В некоторых ситуациях избегание кеширования действительно является ошибкой. Одним из решений является использование метода POST, который никогда не кешируется; однако он предназначен для других операций. Другим решением является использование метода запроса GET, включающего уникальную строку запроса с каждым вызовом, как показано на примере ниже.

req.open("GET", "xmlprovider.php?hash=" + Math.random());

Следует помнить, что такой способ сильно забивает кеш. Лучше воспользоваться установкой заголовка Expires на прошедшую дату в вашем скрипте, который генерирует содержимое XML. В PHP это будет так:

header("Cache-Control: no-store, no-cache, must-revalidate"); header("Expires: " . date("r")); header("Expires: -1", false);

В сервлетах Java это будет так:

response.setHeader("Pragma", "no-cache"); response.setHeader("Cache-Control", "must-revalidate"); response.setHeader("Cache-Control", "no-cache"); response.setHeader("Cache-Control", "no-store"); response.setDateHeader("Expires", 0);

Иначе можно заставить объект XMLHttpRequest всегда вытаскивать новое содержимое, не используя кеш.

req.open("GET", "xmlprovider.php"); req.setRequestHeader("If-Modified-Since", "Sat, 1 Jan 2000 00:00:00 GMT"); req.send(null);

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

См. также

Ссылки

  1. ↑ XMLHttpRequest object explained by the W3C Working Draft. W3.org. Архивировано из первоисточника 5 февраля 2012. Проверено 14 июля 2009.
  2. ↑ Новые возможности XMLHttpRequest2
  3. ↑ Native XMLHTTPRequest object

История

Реализация в браузерах

Учебные руководства

Стандарты

Литература

Просмотр этого шаблона API и фреймворки Microsoft
Графика Desktop Window Manager · Direct2D · Direct3D (extensions) · GDI / GDI+ · WPF · Windows Color System · Windows Image Acquisition · Windows Imaging Component
Аудио DirectMusic · DirectSound · DirectX plugin · XACT · Speech API · XAudio2
Мультимедиа DirectX (Media Objects · Video Acceleration) · DirectInput · DirectShow · Image Mastering API · Managed DirectX · Media Foundation · XNA · Windows Media · Video for Windows
Web MSHTML · RSS Platform · JScript · VBScript · BHO · XDR · SideBar Gadgets
Доступ к данным Data Access Components · Extensible Storage Engine · ADO.NET · ADO.NET Entity Framework · Sync Framework · Jet Engine · MSXML · OLE DB · OPC
Сеть Winsock (LSP) · Winsock Kernel · Filtering Platform · Network Driver Interface Specification · Windows Rally · BITS · P2P API · MSMQ · MS MPI · DirectPlay
Коммуникации Messaging API · Telephony API · WCF
Администрирование и управление Win32 console · Windows Script Host · WMI (extensions) · PowerShell · Task Scheduler · Offline Files · Shadow Copy · Windows Installer · Error Reporting · Event Log · Common Log File System
Компонентная модель COM · COM+ · ActiveX · Distributed Component Object Model · .NET Framework
Библиотеки Base Class Library (BCL) · Microsoft Foundation Classes (MFC) · Active Template Library (ATL) · Windows Template Library (WTL)
Драйверы устройств Windows Driver Model · Windows Driver Foundation (KMDF · UMDF) · WDDM · NDIS · UAA · Broadcast Driver Architecture · VxD
Безопасность Crypto API (CAPICOM) · Windows CardSpace · Data Protection API · Security Support Provider Interface (SSPI)
.NET ASP.NET · ADO.NET · Base Class Library (BCL) · Remoting · Silverlight · TPL · WCF · WCS · WPF · WF
Программное обеспечение EFx Factory · Enterprise Library · Composite UI · CCF · CSF
IPC MSRPC · Dynamic Data Exchange (DDE) · Remoting · WCF
Доступность Active Accessibility · UI Automation
Текст и многоязнаяподдержка DirectWrite · Text Services Framework · Text Object Model · Input method editor · Language Interface Pack · Multilingual User Interface · Uniscribe
Просмотр этого шаблона Стандарты Консорциума Всемирной паутины
Рекомендации Canonical XML • CDF • CSS • DOM • Geolocation API • HTML • ITS • MathML • OWL • P3P • PLS • RDF (Schema) • SISR • SKOS • SMIL • SOAP • SRGS • SSML • SVG • SPARQL • Timed Text • VoiceXML • WSDL • XForms • XHTML • XHTML+RDFa • XInclude • XLink • XML (Base • Encryption • Events • Information Set • namespace • Schema • Signature) • XPath / 1.0 / 2.0 • XPointer • XProc • XQuery • XSL • XSL-FO • XSLT (элементы) • XUP
Примечания XAdES • XHTML+SMIL
Рабочие проекты CCXML • CURIE • HTML5 • InkML • RIF • SCXML • SMIL Timesheets • sXBL • WICD • XFDL • XFrames • XBL • XHTML+MathML+SVG • XMLHttpRequest
Guidelines Web Content Accessibility Guidelines
Initiative Multimodal Interaction Activity • Markup Validation Service • Web Accessibility Initiative
Deprecated CHTML • HDML • JSSS • PGML • VML
Организации World Wide Web Foundation • SVG Working Group • WebOnt • Device Description Working Group • WHATWG
ПО Agora • Argo • Arena • Amaya • CERN httpd • Libwww • Line Mode Browser
Конференции IW3C2 • World Wide Web Conference • WWWC1
Просмотр этого шаблона Программные интерфейсы и фреймворки Microsoft Windows
Графика Проводник Windows • DirectX • Direct3D • GDI • Windows Presentation Foundation • Windows Color System • Windows Image Acquisition • Windows Imaging Component
Звук DirectSound • DirectMusic • XACT • Speech API • MME
Мультимедиа DirectShow • Windows Media • Media Foundation
Веб MSHTML • MSXML • Платформа RSS для Windows • JScript • ActiveX • XMLHttpRequest • Гаджеты
Доступ к данным Компоненты Microsoft Data Access • Extensible Storage Engine • ADO.NET • Sync Framework • Jet-механизм
Сети Winsock (LSP) • Filtering Platform • NDIS • Windows Rally • Сервис фоновой интеллектуальой передачи данных • P2P API
Коммуникации TAPI
Администрирование Консоль Win32 • Windows Script Host • Инструментарий управления Windows • PowerShell • Планировщик задач • Offline Files • Теневое копирование • Windows Installer • Диспетчер ошибок Windows • Журнал событий Windows
Модель компонентов COM • COM+ • DCOM • .NET Framework
Библиотеки Microsoft Foundation Classes (MFC) • Active Template Library (ATL) • Windows Template Library (WTL) • Base Class Library (BCL)
Разработка драйверов Windows Driver Model • Windows Driver Foundation (KMDF • UMDF)
Безопасность CryptoAPI (CAPICOM) • Windows CardSpace • Data protection API • Security Support Provider Interface
.NET .NET Framework • ASP.NET • ADO.NET • .NET Remoting • Windows Presentation Foundation • Windows Workflow Foundation • Windows Communication Foundation • Windows CardSpace • XNA Framework • Silverlight • Библиотека параллельного программирования
Межпроцессноевзаимодействие Dynamic Data Exchange (DDE) • MSRPC • Именованные каналы
Текст иподдержка языков Framework Текстовых сервисов • Объектная модель текстов • Редактор метода ввода • Языковые пакеты • Многоязычный интерфейс
Игры XNA Framework • DirectX