在 XMLHttpRequest 中获取 SENT 标头

Question

Trying to get the Request headers from the XHR object, but with no luck, is there a hidden method or property of that object that will expose the headers sent by the browser?

I already know how to set custom request headers and view the response headers, I'm looking to get a list of all REQUEST headers sent, ones created by the browser and my custom ones.

I'm using webkit/chrome, don't care about other browsers.

EDIT: I'm not looking to monitor the request, I'm building a web app and I need to list those headers and display them within the app, please don't tell me about fiddler, firebug and chrome tools, that's not what I'm looking for.

Answer 1

There is no method in the XMLHttpRequest API to get the sent request headers . There are methods to get the response headers only, and set request headers.

You'll have to either have the server echo the headers, or use a packet sniffer like Wireshark.

Answer 2

Try using Fiddler Web Debugger.

http://www.fiddler2.com/fiddler2/

You can capture the request that was sent in any browser as well as inspect the request headers, response headers, and even copy a capture sent request and send it out as your own.

Answer 3

As the name suggests, sent headers were SENT, (duh). And the XMLHttpRequest class doesn't store sent headers in RAM or put sent headers in an instance of XMLHttpRequest... which is good for performance.

If you want to get the headers that have been sent, all you need to do is to create a log mechanism.

And since custom request header are created through XMLHttpRequest.prototype.setRequestHeader() , You need to intercept XMLHttpRequest.prototype.setRequestHeader() ;

var sentHeaders = {}
var originalXMLHttpRequest_setRequestHeader = XMLHttpRequest.prototype.setRequestHeader;

XMLHttpRequest.prototype.setRequestHeader = function(header, value) {
    sentHeaders[header] = value;
    originalXMLHttpRequest_setRequestHeader.call(this, header, value);
}

That's all. No need for external library nor Wireshark. All done within Javascript;

Just make sure the intercept code above executed before any XMLHttpRequest initialization.

Ps. this code will obviously only intercept the custom header created through setRequestHeader() . The XMLHttpRequest itself will set some default headers which can't be accessed through this method.

Answer 4

Assuming you are using jQuery, and you're looking for anything attached, but maybe not ALL headers sent, this could help. Not sure if it meets your exact needs, (since the browser tends to add its own things), but if you need to grab your own headers first, this works:

$.ajaxSetup({
    beforeSend: function (jqXHR, settings) {
        if(!(settings.headers && settings.headers.token)) {
            //no token header was set, so set the request header
            jqXHR.setRequestHeader('token', newtoken);
        }
    }
})