Javascript 如何使用js或jQuery向ajax请求添加自定义HTTP头？

有人知道如何使用JavaScript或jQuery添加或创建自定义HTTP头吗？

假设您的意思是“使用ajax时”和“HTTP请求头”，然后在传递给

ajax（）的对象中使用
headers
属性

标题（添加1.5）

默认值：
{}

与请求一起发送的附加标头键/值对的映射。此设置在调用beforeSend函数之前设置；因此，可以从beforeSend函数中覆盖headers设置中的任何值

-下面是一个使用XHR2的示例：

function xhrToSend(){
    // Attempt to creat the XHR2 object
    var xhr;
    try{
        xhr = new XMLHttpRequest();
    }catch (e){
        try{
            xhr = new XDomainRequest();
        } catch (e){
            try{
                xhr = new ActiveXObject('Msxml2.XMLHTTP');
            }catch (e){
                try{
                    xhr = new ActiveXObject('Microsoft.XMLHTTP');
                }catch (e){
                    statusField('\nYour browser is not' + 
                        ' compatible with XHR2');                           
                }
            }
        }
    }
    xhr.open('POST', 'startStopResume.aspx', true);
    xhr.setRequestHeader("chunk", numberOfBLObsSent + 1);
    xhr.onreadystatechange = function (e) {
        if (xhr.readyState == 4 && xhr.status == 200) {
            receivedChunks++;
        }
    };
    xhr.send(chunk);
    numberOfBLObsSent++;
}; 

希望有帮助

如果创建对象，则可以使用setRequestHeader函数在发送请求之前分配名称和值。
假设使用JQuery ajax，可以添加自定义头，如-

$.ajax({
  url: url,
  beforeSend: function(xhr) {
    xhr.setRequestHeader("custom_header", "value");
  },
  success: function(data) {
  }
});

应使用XMLHttpRequest对象的“setRequestHeader”方法

或者，如果希望为以后的每个请求发送自定义标头，则可以使用以下命令：

$.ajaxSetup({
    headers: { "CustomHeader": "myValue" }
});

这样，未来的每个ajax请求都将包含自定义头，除非请求的选项显式覆盖。您可以在
ajaxSetup
上找到更多信息。根据您的需要，有几种解决方案

如果要向单个请求添加自定义头（或一组头），只需添加
头
属性：

// Request with custom header
$.ajax({
    url: 'foo/bar',
    headers: { 'x-my-custom-header': 'some value' }
});

如果要向每个请求添加默认头（或一组头），请使用
$.ajaxSetup（）
：

如果要向每个请求添加一个头（或一组头），请使用
发送前的
钩子
$。ajaxSetup（）
：

编辑（更多信息）：需要注意的一点是，使用
ajaxSetup
只能定义一组默认标题，在发送之前只能定义一个
。如果多次调用
ajaxSetup
，将只发送最后一组标头，并且只执行发送前的最后一次回调。
应避免使用中所述的
$.ajaxSetup（）
。请改用以下方法：

$(document).ajaxSend(function(event, jqXHR, ajaxOptions) {
    jqXHR.setRequestHeader('my-custom-header', 'my-value');
});

您也可以不使用jQuery来实现这一点。重写XMLHttpRequest的send方法并在其中添加标头：

XMLHttpRequest.prototype.realSend = XMLHttpRequest.prototype.send;
var newSend = function(vData) {
    this.setRequestHeader('x-my-custom-header', 'some value');
    this.realSend(vData);
};
XMLHttpRequest.prototype.send = newSend;

您可以使用js


异步函数发送（url、数据）{
让r=等待获取（url{
方法：“张贴”，
标题：{
“我的标题”：“abc”
},
正文：JSON.stringify（数据），
})
return wait r.json（）
}
//示例用法
让url为空https://server.test-cors.org/server?enable=true&status=200&methods=POST&headers=my-标题'；
异步函数run（）
{
让jsonObj=wait-send（url，{some:'testdata'}）；
console.log（jsonObj[0].request.httpMethod+'was send-打开chrome控制台>网络查看'）；
}
run（）在我真正想完成这项工作的地方，这似乎实际上不起作用。您应该确保在实际的ajax调用之前调用ajaxSetup。我不知道这不起作用的任何其他原因：）如果我在执行
$.ajax
回调时定义一个新的
beforeSend
，会发生什么情况？您只能定义一个
beforeSend
回调。如果您调用
$.ajaxSetup（{beforeSend:func…}）
两次，则第二次回调将是唯一触发的回调。更新了我的答案以添加有关
ajaxSetup
的更多详细信息。看起来它不适用于CORS请求（每个浏览器）。有解决办法吗？@Si8，我觉得这是个跨域问题。您不能从一个域向另一个域发出请求。尝试查看CORS，看看这是否有帮助。虽然这在2011年可能是正确的，但一般来说，最好不要重新发明轮子，而是使用像Zepto或jQuery这样的AJAX库。除非您试图向现有的XHR2调用添加一个头，并且不想开始重写它来使用jQuery来实现这一点。。。在这一点上，@gryzzly有了唯一可行的答案。@AliGajani问题是某些应用程序或库（如THREE.js）不使用
$。ajax*
函数b/c它们不依赖于jQuery，而是使用XHR，因此这是这些情况下唯一有效的选项。@AliGajani另外，这不仅是网络加载时间，而且是库的解析时间。另外，如果您不小心添加了哪些依赖项，那么很快就会得到一个依赖项太多的项目
$(document).ajaxSend(function(event, jqXHR, ajaxOptions) {
    jqXHR.setRequestHeader('my-custom-header', 'my-value');
});

XMLHttpRequest.prototype.realSend = XMLHttpRequest.prototype.send;
var newSend = function(vData) {
    this.setRequestHeader('x-my-custom-header', 'some value');
    this.realSend(vData);
};
XMLHttpRequest.prototype.send = newSend;