使用jQuery将访问控制请求标头添加到AJAX请求的标头中

Question

我想将自定义标头添加到jQuery的AJAX POST请求中。

我已经试过了：

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

当我发送此请求并观看FireBug时，看到以下标头：

选项xxxx / yyyy HTTP / 1.1
主机：127.0.0.1:6666
用户代理：Mozilla / 5.0（Windows NT 6.1; WOW64; rv：11.0）Gecko / 20100101 Firefox
/ 11.0
接受：text / html，application / xhtml + xml， application / xml; q = 0.9， / ;
q = 0.8
Accept-Language：fr，fr-fr; q = 0.8，en-us; q = 0.5，en; q = 0.3
Accept-Encoding：gzip，deflate
连接：keep -alive
来源：null
访问控制请求方法：POST
访问控制请求头：my-first-header，my-second-header
语法：no-cache
缓存控制：no-cache

为什么我的自定义标头转到Access-Control-Request-Headers：

访问控制请求标头：我的第一个标头，我的第二个标头

我期待这样的标头值：

My-First-Header：第一个值
My-Second-Header：第二个值

可能吗？

Answer 1

您在Firefox中看到的不是实际的请求；请注意，HTTP方法是OPTIONS，而不是POST。实际上，这是浏览器发出的“飞行前”请求，以确定是否应允许跨域AJAX请求：

http://www.w3.org/TR/cors/

飞行前请求中的Access-Control-Request-
Headers标头包括实际请求中的标头列表。然后，在浏览器提交实际请求之前，服务器将报告在此上下文中是否支持这些标头。