web-dev-qa-db-ja.com

JS / jQueryはHTTPRequest要求ヘッダーを取得しますか？

XhrオブジェクトでgetAllResponseHeadersを使用すると、ajax呼び出し後にすべての応答ヘッダーを取得できます。しかし、Requestヘッダー文字列を取得する方法が見つかりません、それは可能ですか？

javascriptajaxheaderrequestrequest-headers
23
Lwyrn

これがデバッグ目的の場合、FirebugまたはChrome Developer Tools（およびIEで呼び出される機能）を使用して、ブラウザーからサーバーへのネットワークトラフィックを調べることができます。

別の方法は、このスクリプトのようなものを使用することです。

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

ただし、headersで既に定義されているヘッダーのみが利用可能だと思います（ヘッダーが変更された場合にどうなるかはわかりません（たとえばbeforeSendで））。

JQuery ajaxについてもう少し読むことができます： http://api.jquery.com/jQuery.ajax/

EDIT：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);
}

ヘッダーがXMLHttpRequestインスタンスに設定されると、xhr.headersを調べることでそれらを取得できます。

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

できることは、SinonのFakeXMLHttpRequestを使用してブラウザのXHRを置き換えることです。テストでの使用方法については このドキュメント で説明されていますが、デバッグの目的でモジュールを使用できると確信しています。

あなたがする必要があるのは：

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

後で、ヘッダーのrequests配列を次の方法で確認できます。

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

リクエストヘッダーにアクセスします。

1
Reza S