Методы объекта XMLHttpRequest
Хочу сразу обратить внимание на то, что названия методов написаны в том же стиле, что и JavaScript. При написании будьте внимательны.
open(тип_запроса, URL, асинхронный, имя_пользователя, пароль) - запрос к серверу с указанием:
типа запроса (обязательный параметр) - используется GET или POST, но доступны также TRACE/DELETE/PUT;
url (обязательный параметр) - адрес запроса. Можно использовать не только протокол HTTP/HTTPS, но и, например, FTP и FILE://.;
асинхронный (булево значение - соответственно true или false) - true для использования асинхронных запросов;
userName, password - данные HTTP-аутентификации;
Внимание! Данные по userName, password небезопасно хранить в скрипте, в особенности на клиентской части, так как данные аутентификации будут доступны сторонним пользователям. |
Варианты вызова:
open( method, URL )
open( method, URL, async )
open( method, URL, async, userName )
open( method, URL, async, userName, password )
send(содержимое) - отправка запроса HTTP на сервер и получение ответа. В качестве аргумента - тело запроса. Поскольку для GET-запроса тела нет, надо писать send(null), для POST-запросов тело содержит параметры запроса.
abort() - текущий запрос отменяем. У браузера есть лимит - два одновременных подключения к домену-порту. Третье будет открыто только после завершения сеанса одно из предыдущих двух (по таймауту).
xmlhttp.abort()
getAllResponseHeaders() - запрашиваем все заголовки ответа от сервера. Возвращает строку со всеми HTTP-заголовками ответа сервера.
getResponseHeader(имя_заголовка) - запрос на определённый заголовок.
setRequestHeader(имя_заголовка,значение) - устанавливаем заголовок и значение запроса. Если заголовок уже есть, то он заменяется. Пример:
xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded')
Свойства объекта XMLHttpRequest
onreadystatechange - одно из основных свойств объекта XMLHttpRequest. Ссылается на функцию-обработчик состояний запроса, которая вызывается каждый раз при смене статуса объекта. В некоторых браузерах функция имеет аргумент - событие. Не используйте его, он совершенно лишний.
readyState - номер состояния запроса. От 0 до 4:
0 - не инициализирован (перед началом работы объекта),
1 - загрузка (однажды, когда идет инициализация объекта),
2 - загружен (однажды, когда получен ответ от сервера),
3 - доступен (пока объект соединен с сервером),
4 - завершен (после того, как объект выполнил все задачи).
responseText - представление ответа сервера в виде обычного текста (строки). Полный текст есть только при readyState=4, ряд браузеров дают доступ к полученной части ответа сервера при readyState=3.
responseXML - объект документа, совместимый с DOM, полученного от сервера.
status - состояние ответа от сервера. Например, для HTTP-запросов - статусный код ответа сервера: 200 - OK, 404 - Not Found, и так далее. Запросы по протоколам FTP, FILE:// не возвращают статуса, поэтому нормальным для них является status=0.
statusText - текстовое представление состояния ответа от сервера. Например, Not Found или OK
Пример работы с обектом XMLHttpRequest
План работы с объектом XMLHttpRequest можно представить так:
1. Создание объекта XMLHttpRequest.
2. Установка обработчика события onreadystatechange.
3. Открытие соединения с сервером методом open.
4. Отправка запроса методом send.
Код Ajax
/*
Функция посылки запроса к файлу на сервере
r_method - тип запроса: GET или POST
r_path - путь к файлу
r_args - аргументы вида a=1&b=2&c=3...
r_handler - функция-обработчик ответа от сервера
*/
function SendRequest(r_method, r_path, r_args, r_handler)
{
//Создаём запрос
var Request = CreateRequest();
//Проверяем существование запроса еще раз
if (!Request)
{
return;
}
//Назначаем пользовательский обработчик
Request.onreadystatechange = function()
{
//Если обмен данными завершен
if (Request.readyState == 4)
{
//Передаем управление обработчику пользователя
r_handler(Request);
}
}
//Проверяем, если требуется сделать GET-запрос
if (r_method.toLowerCase() == "get" && r_args.length > 0)
r_path += "?" + r_args;
//Инициализируем соединение
Request.open(r_method, r_path, true);
if (r_method.toLowerCase() == "post")
{
//Если это POST-запрос
//Устанавливаем заголовок
Request.setRequestHeader("Content-Type","application/x-www-form-urlencoded; charset=utf-8");
//Посылаем запрос
Request.send(r_args);
}
else
{
//Если это GET-запрос
//Посылаем нуль-запрос
Request.send(null);
}
}
Спасибо за внимание!