JavaScript XMLHttpRequest.getResponseHeader() — заголовок відповіді

Метод getResponseHeader() читає заголовок відповіді сервера — наприклад, Content-Type чи X-Total-Count.

правити

Загальний опис

Тут чекає сюрприз, який коштує людям годин налагодження. При запиті на інший домен (CORS) браузер показує лише шість базових заголовків: Cache-Control, Content-Language, Content-Type, Expires, Last-Modified, Pragma.

Свій заголовок (скажімо, X-Total-Count із кількістю сторінок) буде невидимим — метод поверне null, хоч у вкладці «Мережа» заголовок чудово видно.

Щоб він став доступним, сервер має перелічити його в Access-Control-Expose-Headers. Виправляється це лише на сервері, з боку клієнта — ніяк.

правити

Нотатка

Заголовок є у вкладці «Мережа», а метод повертає null? Це CORS. Сервер має додати Access-Control-Expose-Headers: X-Total-Count.

автор: NagarD правити

+ додати пораду чи нотатку

Переглядачі

Стаціонарні переглядачі Мобільні переглядачі

Підтримка: стаціонарні переглядачі

Переглядач
getResponseHeader	1+	1+	1.2+	8+	12+	7+

Підтримка: мобільні переглядачі

Переглядач
getResponseHeader	yes	yes	yes	yes

Приклади

+ запропонувати свій приклад у пісочниці

const xhr = new XMLHttpRequest();

xhr.onload = () => {
    console.log(xhr.getResponseHeader('Content-Type')); // видно завжди

    // при CORS — null, якщо сервер не дозволив явно
    const total = xhr.getResponseHeader('X-Total-Count');
    console.log('Усього записів:', total);
};

xhr.open('GET', 'https://api.example.com/items');
xhr.send();