Пользовательские заголовки в запросах AJAX POST с помощью jQuery

В запросы AJAX POST, инициированные с помощью jQuery, можно включать собственные заголовки. Однако механизм добавления заголовков отличается от типичного подхода.

Когда вы указываете заголовки, как показано в примере:

$.ajax({
    type: 'POST',
    url: url,
    headers: {
        "My-First-Header":"first value",
        "My-Second-Header":"second value"
    }
}).done(function(data) {
    alert(data);
});

Понятно, что вы ожидаете, что заголовки будут отправлены как:

My-First-Header: first value
My-Second-Header: second value

Однако меры безопасности браузера не позволяют отправлять значения пользовательского заголовка непосредственно в исходном запросе. Вместо этого они помещаются в заголовок Access-Control-Request-Headers. Это механизм безопасности, известный как предварительный запрос.

Чтобы последующий запрос мог включать фактические значения заголовков, сервер должен настроить необходимые заголовки CORS (совместное использование ресурсов между источниками).

Решением этой проблемы является отправка заголовков другим способом, как показано в приведенном примере кода:

$.ajax({
  type: "POST",
  beforeSend: function(request) {
    request.setRequestHeader("Authority", authorizationToken);
  },
  url: "entities",
  data: "json="   escape(JSON.stringify(createRequestObject)),
  processData: false,
  success: function(msg) {
    $("#results").append("The result ="   StringifyPretty(msg));
  }
});

Этот подход фактически устанавливает значения заголовков запроса напрямую, минуя размещение заголовков Access-Control-Request-Headers. Он предоставляет возможность отправлять пользовательские заголовки вместе с первоначальным запросом без необходимости настройки сервера.