AJAX запрос данных из http заголовка

Пример получения данных из HTTP заголовка отклика на AJAX запрос.

Приводимый скрипт во многом повторяет предыдущие по теме AJAX, поэтому объяснения будут краткими, более детальное описание нужно смотреть по ссылке Пример AJAX запроса.

Как обычно, вначале наглядный пример использования, спросим у браузера более детальную информацию об отклике.

Ответ сервера:

По кнопке «Запрос» вызывается функция getData(), которая запускает AJAX запрос.


function getData() {
  var addr = 'http://путь_к_скрипту_сервера/getHeader.php';
  sendData('GET', addr, getHeader);
}

Все просто: формируем адресную строку и вызываем sendData(), определяем метод запроса, а третьим параметром передаем функцию, которая обработает пришедший отклик.

function sendData(method, addr, callback)
 {
     var request = new XMLHttpRequest();
     request.open(method, addr);
     request.addEventListener("readystatechange", () => {
                 callback(request);
             });
     request.send();
 }

Здесь тоже все стандартно, все действо по чтению заголовков отклика естественно происходит в той функции обратного вызова, которую мы передали в параметрах.

function getHeader(request) {
     var headerName = getHeaderName();
     var headerValue;
     if(request.readyState === request.HEADERS_RECEIVED) {
         if (headerName !== 'getAllResponseHeaders') {
             headerValue = request.getResponseHeader(headerName);
         } else {
             headerValue = request.getAllResponseHeaders();
             console.log(headerValue);
         }
         if (headerValue !== null) {
             var strArr = headerValue.split("\n");
             var str = '';
             for (let i = 0; i < strArr.length; i++) {                 str += strArr[i] + "
";
             }
             document.getElementById('response').innerHTML = str;
         } else {
             document.getElementById('response').innerHTML = 'Запрошенное значение в заголовках отклика не определено';
         }
     }   
 }

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