JavaScript Отправка Ajax - пример кода ActiveXObject, XMLHttpRequest
Primary tabs
Как кроссбраузерно создать объект, через который можно будет выполнять Ajax запросы
Для создания объекта на чистом JavaScript можно использовать такую функцию:
(идея состоит в том, чтобы сначала попробовать создать объекты для IE, а потом уже, если не получится, для остальных браузеров)
/**
* Создаёт объект для выполнения запроса
*
* @returns {ActiveXObject|XMLHttpRequest|Boolean}
*/
function getXmlHttp(){
var xmlhttp; // тут будет возвращаемый объект
// сначала предположим что мы в IE и создадим объект запроса для него
try { // пробуем создать ActiveXObject типа Msxml2.XMLHTTP
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) { // если не получилось, то
try { // пробуем создать ActiveXObject типа Microsoft.XMLHTTP
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (E) { // если не получилось
xmlhttp = false; // выставляем признак появления исключения
}
}
/* далее если было получено исключение
* и тип XMLHttpRequest известен в текущем браузере -
* создаём уже объект этого типа: */
if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
xmlhttp = new XMLHttpRequest();
}
return xmlhttp; // возвращаем то, что получилось
}
Как отправлять запросы
Примеры отправки синхронного и асинхронного запроса:
// синхронный запрос - с блокировкой до получения ответа
var xmlhttp = getXmlHttp(); // получаем объект, запроса используя функцию выше
// указываеем метод HTTP - в данном случае GET, адрес и то, что запрос будет синхронным (false)
xmlhttp.open('GET', '/xhr/test.html', false);
xmlhttp.send(null); // отправляем данные (здесь просто null) - выполняем синхронный запрос
if(xmlhttp.status == 200) { // проверяем статус ответа (успешно ли завершился)
alert(xmlhttp.responseText); // выводим сообщение с текстом ответа
}
//-----------------------------------
// асинхронный пример (браузер не будет блокировать функционал, во время получения ответа)
var xmlhttp = getXmlHttp(); // получаем объект, запроса используя функцию выше
// указываеем метод HTTP - в данном случае GET, адрес и то, что запрос будет синхронным (false)
xmlhttp.open('GET', '/xhr/test.html', true);
// назначаем функцию, которая запустится после того как ответ придёт
xmlhttp.onreadystatechange = function() {
//описываем её реализацию
if (xmlhttp.readyState == 4) { // проверяем состояние - (пришёл ли?)
if(xmlhttp.status == 200) { // проверяем статус
//alert(xmlhttp.responseText); // выводим текст
console.log('Ответ:', xmlhttp.responseText); // печать ответа сервера в консоль
}
}
};
xmlhttp.send(null); // выполняем асинхронный запрос
Источник: см. подробности на xmlhttprequest.ru/
- Log in to post comments
- 3195 reads