Encabezados personalizados en solicitudes POST AJAX con jQuery

En solicitudes POST AJAX iniciadas con jQuery, es posible incluir encabezados personalizados. Sin embargo, el mecanismo para agregar encabezados difiere del enfoque típico.

Cuando especifica encabezados como se muestra en el ejemplo:

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

Es comprensible que espere que los encabezados se envíen como:

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

Sin embargo, las medidas de seguridad del navegador impiden enviar los valores de encabezado personalizados directamente en la solicitud inicial. En su lugar, se colocan en el encabezado Access-Control-Request-Headers. Este es un mecanismo de seguridad conocido como solicitud de verificación previa.

Para permitir que la solicitud posterior incluya los valores de encabezado reales, el servidor debe configurar los encabezados CORS (intercambio de recursos entre orígenes) necesarios.

Una solución a esto es enviar los encabezados de una manera diferente, como se muestra en el código de muestra proporcionado:

$.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));
  }
});

Este enfoque en realidad establece los valores del encabezado de solicitud directamente, sin pasar por la ubicación de Access-Control-Request-Headers. Proporciona una manera de enviar encabezados personalizados con la solicitud inicial sin necesidad de configuración del servidor.