Объект XMLHttpRequest — это краеугольный камень в AJAX.
Все современные браузеры поддерживают объект XMLHttpRequest.
Объект XMLHttpRequest может использоваться для обмена данными с сервером за кулисами сайта. Это означает, что становится возможным обновлять отдельные части веб-страницы, не перезагружая ее полностью.
Создание объекта XMLHttpRequest
У всех современных браузеров (Chrome, Firefox, IE7+, Edge, Safari, Opera) есть встроенный объект XMLHttpRequest.
Синтаксис создания объекта XMLHttpRequest:
переменная = new XMLHttpRequest();
Пример:
var xhttp = new XMLHttpRequest();
Взаимодействие между доменами
Из соображения безопасности современные браузеры не допускают обращение между доменами.
Это означает, что и сама веб-страница и файл, который она будет загружать по AJAX, должны находиться на одном и том же сервере.
Старые браузеры (IE5 и IE6)
В старых браузерах Internet Explorer (5/6) вместо объекта XMLHttpRequest используется объект ActiveX:
переменная = new ActiveXObject("Microsoft.XMLHTTP");
Чтобы AJAX работал также в IE5 и IE6, необходимо проверить, поддерживает ли браузер объект XMLHttpRequest, и, если нет, то создать объект ActiveX:
if (window.XMLHttpRequest) {
// код для современных браузеров
xmlhttp = new XMLHttpRequest();
} else {
// код для старых браузеров IE
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
Методы объекта XMLHttpRequest
Метод | Описание |
---|---|
new XMLHttpRequest() | Создает новый объект XMLHttpRequest |
abort() | Отменяет текущий запрос |
getAllResponseHeaders() | Возвращает полный список HTTP-заголовков ответа сервера |
getResponseHeader(headerName) | Возвращает значение заголовка ответа сервера с именем headerName |
open(method, url, async, user, psw) | Определяет параметры запроса: method — тип запроса (GET или POST) url — расположение файла async — true (асинхронный) или false (синхронный) user — имя пользователя (не обязательный) psw — пароль (не обязательный) |
send() | Посылает запрос на сервер Используется для запросов GET |
send(контент) | Посылает запрос на сервер Используется для запросов POST |
setRequestHeader(метка, значение) | Добавляет HTTP-заголовок к запросу виде пары метка/значение |
Свойства объекта XMLHttpRequest
Свойство | Описание |
---|---|
onreadystatechange | Определяет функцию-обработчик события, которое происходит каждый раз при изменении свойства readyState |
readyState | Текущее состояние объекта XMLHttpRequest: 0 — запрос не инициализирован 1 — соединение с сервером установлено 2 — запрос получен 3 — обработка запроса 4 — запрос завершен и ответ готов |
responseText | Возвращает данные ответа в виде строки |
responseXML | Возвращает данные ответа в виде XML |
status | Возвращает статус запроса в виде числа: 200 — "OK" 403 — "Forbidden" 404 — "Not Found" |
statusText | Возвращает статус запроса в виде строки (например, "OK" или "Not Found") |