JS/jQuery获取HTTPRequest请求头?

时间:2022-10-14 21:01:00

Using getAllResponseHeaders in the xhr object, is possible to get all the response headers after an ajax call. But I can't found a way to get the Request headers string, is that possible ?

在xhr对象中使用getAllResponseHeaders,可以在ajax调用之后获得所有的响应header。但是我找不到获取请求头字符串的方法,这可能吗?

2 个解决方案

#1


19  

If this is for debugging purposes then you can just use Firebug or Chrome Developer Tools (and whatever the feature is called in IE) to examine the network traffic from your browser to the server.

如果这是为了调试目的,那么您可以使用Firebug或Chrome开发工具(以及IE中调用的任何特性)检查从浏览器到服务器的网络流量。

An alternative would be to use something like this script:

另一种选择是使用如下脚本:

$.ajax({
    url: 'someurl',
    headers:{'foo':'bar'},
    complete: function() {
        alert(this.headers.foo);
    }
});

However I think only the headers already defined in headers is available (not sure what happens if the headers are altered (for instance in beforeSend).

但是,我认为只有在header中定义的header是可用的(不确定如果更改了header会发生什么情况(例如在前文)。

You could read a bit more about jQuery ajax at: http://api.jquery.com/jQuery.ajax/

您可以在http://api.jquery.com/jQuery.ajax/上阅读更多关于jQuery ajax的内容

EDIT: If you want to just catch the headers on all calls to setRequestHeader on the XMLHttpRequest then you can just wrapp that method. It's a bit of a hack and of course you would need to ensure that the functions wrapping code below is run before any of the requests take place.

编辑:如果你想在XMLHttpRequest上的setRequestHeader的所有调用上捕捉头,那么你就可以使用这个方法。这有点麻烦,当然您需要确保在任何请求发生之前运行下面的函数包装代码。

// Reasign the existing setRequestHeader function to 
// something else on the XMLHtttpRequest class
XMLHttpRequest.prototype.wrappedSetRequestHeader = 
  XMLHttpRequest.prototype.setRequestHeader; 

// Override the existing setRequestHeader function so that it stores the headers
XMLHttpRequest.prototype.setRequestHeader = function(header, value) {
    // Call the wrappedSetRequestHeader function first 
    // so we get exceptions if we are in an erronous state etc.
    this.wrappedSetRequestHeader(header, value);

    // Create a headers map if it does not exist
    if(!this.headers) {
        this.headers = {};
    }

    // Create a list for the header that if it does not exist
    if(!this.headers[header]) {
        this.headers[header] = [];
    }

    // Add the value to the header
    this.headers[header].push(value);
}

Now, once the headers have been set on an XMLHttpRequest instance we can get them out by examining xhr.headers e.g.

现在,一旦在XMLHttpRequest实例上设置了报头,我们就可以通过检查xhr来获取报头。头如。

var xhr = new XMLHttpRequest();
xhr.open('get', 'demo.cgi');
xhr.setRequestHeader('foo','bar');
alert(xhr.headers['foo'][0]); // gives an alert with 'bar'

#2


1  

Something you could to is use Sinon's FakeXMLHttpRequest to replace your browser's XHR. It's described in this document on how to use it for testing but I'm pretty sure you can use the module for your debugging purposes.

您可以使用Sinon的FakeXMLHttpRequest来替换浏览器的XHR。本文档描述了如何使用它进行测试,但我确信您可以将该模块用于调试目的。

What you need to do is:

你需要做的是:

var requests;
this.xhr = sinon.useFakeXMLHttpRequest();
this.xhr.onCreate = function(xhr) {
    requests.push(xhr);
}

And then later on, you can check your requests array for headers by:

之后,您可以通过以下方式检查请求数组的头信息:

console.log(requests[0].requestHeaders);

To access your request headers.

访问你的请求头。

#1


19  

If this is for debugging purposes then you can just use Firebug or Chrome Developer Tools (and whatever the feature is called in IE) to examine the network traffic from your browser to the server.

如果这是为了调试目的,那么您可以使用Firebug或Chrome开发工具(以及IE中调用的任何特性)检查从浏览器到服务器的网络流量。

An alternative would be to use something like this script:

另一种选择是使用如下脚本:

$.ajax({
    url: 'someurl',
    headers:{'foo':'bar'},
    complete: function() {
        alert(this.headers.foo);
    }
});

However I think only the headers already defined in headers is available (not sure what happens if the headers are altered (for instance in beforeSend).

但是,我认为只有在header中定义的header是可用的(不确定如果更改了header会发生什么情况(例如在前文)。

You could read a bit more about jQuery ajax at: http://api.jquery.com/jQuery.ajax/

您可以在http://api.jquery.com/jQuery.ajax/上阅读更多关于jQuery ajax的内容

EDIT: If you want to just catch the headers on all calls to setRequestHeader on the XMLHttpRequest then you can just wrapp that method. It's a bit of a hack and of course you would need to ensure that the functions wrapping code below is run before any of the requests take place.

编辑:如果你想在XMLHttpRequest上的setRequestHeader的所有调用上捕捉头,那么你就可以使用这个方法。这有点麻烦,当然您需要确保在任何请求发生之前运行下面的函数包装代码。

// Reasign the existing setRequestHeader function to 
// something else on the XMLHtttpRequest class
XMLHttpRequest.prototype.wrappedSetRequestHeader = 
  XMLHttpRequest.prototype.setRequestHeader; 

// Override the existing setRequestHeader function so that it stores the headers
XMLHttpRequest.prototype.setRequestHeader = function(header, value) {
    // Call the wrappedSetRequestHeader function first 
    // so we get exceptions if we are in an erronous state etc.
    this.wrappedSetRequestHeader(header, value);

    // Create a headers map if it does not exist
    if(!this.headers) {
        this.headers = {};
    }

    // Create a list for the header that if it does not exist
    if(!this.headers[header]) {
        this.headers[header] = [];
    }

    // Add the value to the header
    this.headers[header].push(value);
}

Now, once the headers have been set on an XMLHttpRequest instance we can get them out by examining xhr.headers e.g.

现在,一旦在XMLHttpRequest实例上设置了报头,我们就可以通过检查xhr来获取报头。头如。

var xhr = new XMLHttpRequest();
xhr.open('get', 'demo.cgi');
xhr.setRequestHeader('foo','bar');
alert(xhr.headers['foo'][0]); // gives an alert with 'bar'

#2


1  

Something you could to is use Sinon's FakeXMLHttpRequest to replace your browser's XHR. It's described in this document on how to use it for testing but I'm pretty sure you can use the module for your debugging purposes.

您可以使用Sinon的FakeXMLHttpRequest来替换浏览器的XHR。本文档描述了如何使用它进行测试,但我确信您可以将该模块用于调试目的。

What you need to do is:

你需要做的是:

var requests;
this.xhr = sinon.useFakeXMLHttpRequest();
this.xhr.onCreate = function(xhr) {
    requests.push(xhr);
}

And then later on, you can check your requests array for headers by:

之后,您可以通过以下方式检查请求数组的头信息:

console.log(requests[0].requestHeaders);

To access your request headers.

访问你的请求头。