JavaScript метод XMLHttpRequest.setRequestHeader()

Определение и применение

JavaScript метод setRequestHeader() объекта XMLHttpRequest задает значение заголовка HTTP запроса.

Обращаю Ваше внимание на то, что при использовании метода setRequestHeader() вы должны вызвать его после вызова метода open(), который инициализирует только что созданный запрос, но перед вызовом метода send(), который позволяет отправить запрос на сервер.

Если метод setRequestHeader() вызывается несколько раз с одним и тем же заголовком, то значения объединяются в один заголовок запроса. Каждый раз, когда вы вызываете setRequestHeader() после первого вызова, указанный текст добавляется в конец содержимого существующего заголовка.

Если заголовок Accept не был установлен с помощью этого метода, то заголовок Accept с типом "* / * " отправляется с запросом при вызове метода send().

По соображениям безопасности некоторые заголовки могут управляться только агентом пользователя. Эти заголовки включают запрещенные имена заголовков и запрещенные имена заголовков ответов.

Поддержка браузерами

Метод	Chrome	Firefox	Opera	Safari	IExplorer	Edge
setRequestHeader()	Да	Да	Да	Да	Да	Да

JavaScript синтаксис:

XMLHttpRequest.setRequestHeader(header, value);
 
header - String
value - String

Cпецификация

Значения параметров

Пример использования

В следующем примере мы рассмотрим с вами как с помощью метода setRequestHeader() задать значение заголовка Content-Type (определяет MIME тип ресурса) HTTP запроса и отправить простой текст на сервер методом POST.

function postTextMessage(url, data) {
	let xhr = new XMLHttpRequest(); // инициализируем переменную новым объектом XMLHttpRequest

	xhr.open("POST", url); // определяем параметры для запроса на определенный адрес
	xhr.setRequestHeader("Content-Type", "text/plain;charset=UTF-8"); // задаем значение заголовка HTTP запроса (текстовые данные в кодировке UTF-8)
	xhr.send(data); // отправляем запрос на сервер (используем значение параметра в качестве тела запроса)
}

В следующем примере мы рассмотрим с вами как с помощью метода setRequestHeader() задать значение заголовка Content-Type HTTP запроса и отправить данные формы на сервер методом POST.

function postFormData(url, data, callback) {
	let xhr = new XMLHttpRequest(); // инициализируем переменную новым объектом XMLHttpRequest

	xhr.open("POST", url); // определяем параметры для запроса на определенный адрес
	xhr.onreadystatechange = function() { // обработчик событий, вызываемый при запуске события readystatechange (при каждом изменении свойства readyState)
		// проверяем состояние запроса, числовой код состояния HTTP ответа и наличие переданной функции
		if (this.readyState === 4 && this.status == 200 && callback) {
			callback(xhr); // вызываем переданную в качестве параметра функ­цию
		}
	}
	xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); // задаем значение заголовка HTTP запроса (значения кодируются в кортежах с ключом, разделенных символом '&', с '=' между ключом и значением)
	xhr.send(data); // отправляем запрос на сервер (используем значение параметра в качестве тела запроса)
} 

В следующем примере мы рассмотрим с вами как с помощью метода setRequestHeader() задать значение заголовка Content-Type HTTP запроса и отправить данные в формате JSON на сервер методом POST.

function postJSONData(url, data, callback) {
	let xhr = new XMLHttpRequest(); // инициализируем переменную новым объектом XMLHttpRequest
	
	xhr.open("POST", url); // определяем параметры для запроса на определенный адрес
	xhr.onreadystatechange = function() { // обработчик событий, вызываемый при запуске события readystatechange (при каждом изменении свойства readyState)
		// проверяем состояние запроса, числовой код состояния HTTP ответа и наличие переданной функции
		if (this.readyState === 4 && this.status == 200 && callback) {
			callback(xhr); // вызываем переданную в качестве параметра функ­цию
		}
	}
	xhr.setRequestHeader("Content-Type", "application/json"); // задаем значение заголовка HTTP запроса (данные в формате JSON)
	xhr.send(data); // отправляем запрос на сервер (используем значение параметра в качестве тела запроса)
}