Общее представление об AJAX. Часть 5

Получение множественных данных от сервера

По умолчанию свойство responxeText используется лишь однократно, поэтому все данные, возвращаемые сервером, помещаются в одной строке. Но зачастую при вызове посредством объекта XMLHttpRequesr требуется получить в ответ не один, а множество фрагментов данных. Эту задачу можно решить по-разному, но, вероятно, самый простой способ состоит в том, чтобы возвратить множественные данные, разделив их фрагменты специальным символом, который отсутствует в самих данных (например, символом табуляции или перевода строки). А обработку полученной информации можно выполнить средствами JavaScript.

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

first
second
third

В приведенном ниже коде осуществляется доступ к отдельным фрагментам возвращаемых данных:

var XMLHttp = getXMLHttp();
XMLHttp.open("GET", "multiple.txt", true);
XMLHttp.onreadystatechange = handlerFunction;
XMLHttp.send(null);

function handlerFunction() {
  if (XMLHttp.readyState == 4) {
    var data = XMLHttp.responseText.split("\n");
    window.alert(data[0] + " " + data[1] + " " + data[2]);
  }
}

function getXMLHttp() {
  var XMLHttp = null;
  if (window.XMLHttpRequest) {
    try {
      XMLHttp = new XMLHttpRequest();
    } catch (e) { }
  } else if (window.ActiveXObject) {
    try {
      XMLHttp = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
      try {
        XMLHttp = new ActiveXObject("Microsoft.XMLHTTP");
      } catch (e) { }
    }
  }
  return XMLHttp;
}

Прерывание запроса HTTP

В зависимости от типа браузера одновременно допускается ограниченное число запросов. При наличии множества компонентов AJAX на странице это может привести к серьёзным осложнениям. В таком случае может возникнуть потребность в прерывании запроса HTTP.

Для этой цели служит метод abort(). В приведенном ниже фрагменте кода запрос прерывается только в том случае, если он не был полностью выполнен по истечении пяти секунд. Такой режим работы демонстрируется с помощью PHP-скрипта delay.php, выполняющегося с задержкой 10 секунд:

<?php
  sleep(10);
  echo 'результат запроса';
?>

При этом проверяется значение свойство readyState. Если оно принимает значение 0 или 4, то прерывать, собственно, нечего.

var XMLHttp = getXMLHttp();
XMLHttp.open("GET", "delay.php?" + Math.random(), true);
XMLHttp.onreadystatechange = handlerFunction;
XMLHttp.send(null);
window.setTimeout("timeout();", 5000);

function handlerFunction() {
  if (XMLHttp.readyState == 4) {
    window.alert("Returned data: " + XMLHttp.responseText);
  }
}

function timeout() {
  if (XMLHttp.readyState != 4 && XMLHttp.readyState != 0) {
    XMLHttp.onreadystatechange = function() { };
    XMLHttp.abort();
    window.alert("Request aborted");
  }
}

function getXMLHttp() {
  var XMLHttp = null;
  if (window.XMLHttpRequest) {
    try {
      XMLHttp = new XMLHttpRequest();
    } catch (e) { }
  } else if (window.ActiveXObject) {
    try {
      XMLHttp = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
      try {
        XMLHttp = new ActiveXObject("Microsoft.XMLHTTP");
      } catch (e) { }
    }
  }
  return XMLHttp;
}

Ссылки по теме:

Оставьте свой отзыв