467

JavaScriptを介してページのHTTP応答ヘッダーにアクセスするにはどうすればよいですか？

この質問に関連して、2つの特定のHTTPヘッダーへのアクセスについて質問するように変更されました。

関連：
JavaScriptを介してHTTPリクエストヘッダーフィールドにアクセスするにはどうすればよいですか？

4

18 に答える 18

401

現在のヘッダーを読み取ることはできません。同じ URL に対して別のリクエストを行い、そのヘッダーを読み取ることはできますが、ヘッダーが現在のものと完全に等しいという保証はありません。

次の JavaScript コードを使用して、getリクエストを実行してすべての HTTP ヘッダーを取得します。

var req = new XMLHttpRequest();
req.open('GET', document.location, false);
req.send(null);
var headers = req.getAllResponseHeaders().toLowerCase();
alert(headers);
于 2011-02-03T01:26:52.083 に答える
328

残念ながら、最初のページリクエストのHTTP応答ヘッダーを提供するAPIはありません。それがここに投稿された元の質問でした。また、元のページリクエストの実際のレスポンスヘッダーを別のヘッダーを発行せずに取得したいという人もいるため、繰り返し質問されています。


AJAXリクエストの場合：

HTTPリクエストがAJAXを介して行われる場合、getAllResponseHeaders()メソッドを使用して応答ヘッダーを取得することができます。これはXMLHttpRequestAPIの一部です。これをどのように適用できるかを確認するには、以下のfetchSimilarHeaders()関数を確認してください。これは、一部のアプリケーションでは信頼できない問題の回避策であることに注意してください。

myXMLHttpRequest.getAllResponseHeaders();

これは、元のページリクエストのHTTP応答ヘッダーに関する情報を提供しませんが、それらのヘッダーが何であるかについての知識に基づいた推測を行うために使用できます。これについては、次に説明します。


初期ページリクエストからヘッダー値を取得する：

この質問は数年前に最初に尋ねられ、現在のページ（つまり、JavaScriptが実行されていたのと同じページ）の元のHTTP応答ヘッダーを取得する方法について具体的に尋ねました。これは、HTTPリクエストの応答ヘッダーを取得するだけの場合とはまったく異なる質問です。最初のページリクエストの場合、JavaScriptでヘッダーをすぐに利用することはできません。AJAXを介して同じページを再度リクエストした場合に必要なヘッダー値が確実かつ十分に一貫しているかどうかは、特定のアプリケーションによって異なります。

以下は、その問題を回避するためのいくつかの提案です。


1.主に静的なリソースに対するリクエスト

応答がほとんど静的であり、ヘッダーがリクエスト間であまり変化しないことが予想される場合は、現在表示している同じページに対してAJAXリクエストを作成し、それらがページの一部であった同じ値であると想定できます。 HTTP応答。これにより、上記の優れたXMLHttpRequestAPIを使用して必要なヘッダーにアクセスできるようになります。

function fetchSimilarHeaders (callback) {
    var request = new XMLHttpRequest();
    request.onreadystatechange = function () {
        if (request.readyState === XMLHttpRequest.DONE) {
            //
            // The following headers may often be similar
            // to those of the original page request...
            //
            if (callback && typeof callback === 'function') {
                callback(request.getAllResponseHeaders());
            }
        }
    };

    //
    // Re-request the same page (document.location)
    // We hope to get the same or similar response headers to those which 
    // came with the current page, but we have no guarantee.
    // Since we are only after the headers, a HEAD request may be sufficient.
    //
    request.open('HEAD', document.location, true);
    request.send(null);
}

値が同じであることを完全に保証することはできないため、要求間で一貫している値に本当に依存する必要がある場合、このアプローチは問題になります。それはあなたの特定のアプリケーションとあなたが必要とする価値が一つの要求から次へと変わらない何かであるとあなたが知っているかどうかに依存するでしょう。


2.推論を行う

ブラウザがヘッダーを見て決定するいくつかのBOMプロパティ（ブラウザオブジェクトモデル）があります。これらのプロパティの一部は、HTTPヘッダーを直接反映します（たとえばnavigator.userAgent、HTTPヘッダーフィールドの値に設定されUser-Agentます）。利用可能なプロパティをスニッフィングすることで、必要なもの、またはHTTP応答に含まれているものを示す手がかりを見つけることができる場合があります。


3.それらを隠します

サーバー側を制御する場合は、完全な応答を作成するときに、任意のヘッダーにアクセスできます。値は、ページとともにクライアントに渡されたり、マークアップに隠されたり、インライン化されたJSON構造に格納されたりする可能性があります。すべてのHTTPリクエストヘッダーをJavaScriptで利用できるようにしたい場合は、サーバー上でそれらを繰り返し処理し、マークアップで非表示の値として送り返すことができます。この方法でヘッダー値を送信することはおそらく理想的ではありませんが、必要な特定の値に対して送信することは確かに可能です。このソリューションも間違いなく非効率的ですが、必要に応じて機能します。

于 2008-10-20T22:55:12.477 に答える
31

を使用XmlHttpRequestすると、現在のページをプルアップして、応答の http ヘッダーを調べることができます。

最良のケースは、HEADリクエストを実行してからヘッダーを調べることです。

これを行ういくつかの例については、http: //www.jibbering.com/2002/4/httprequest.html をご覧ください。

ちょうど私の2セント。

于 2008-11-03T21:53:37.983 に答える
30

Service Worker によるソリューション

サービス ワーカーは、ヘッダーを含むネットワーク情報にアクセスできます。良い点は、XMLHttpRequest だけでなく、あらゆる種類の要求で機能することです。

使い方：

  1. Web サイトに Service Worker を追加します。
  2. 送信されるすべてのリクエストを監視します。
  3. 関数でService Workerfetchにリクエストを行いrespondWithます。
  4. 応答が到着したら、ヘッダーを読み取ります。
  5. 関数を使用して、Service Worker からページにヘッダーを送信しpostMessageます。

作業例:

サービス ワーカーを理解するのは少し複雑なので、これらすべてを行う小さなライブラリを作成しました。github で入手できます: https://github.com/gmetais/sw-get-headers。

制限:

  • Web サイトはHTTPSである必要があります
  • ブラウザはService Workers APIをサポートする必要があります
  • XMLHttpRequest の場合と同様に、同一ドメイン/クロスドメイン ポリシーが実行されています。
于 2016-06-11T10:19:03.070 に答える
18

ヘッダー情報を JavaScript に送信するもう 1 つの方法は、Cookie を使用することです。サーバーは、要求ヘッダーから必要なデータを抽出して、応答ヘッダー内に送り返すSet-Cookieことができます。Cookie は JavaScript で読み取ることができます。ただし、keparo が言うように、すべてのヘッダーではなく、1 つまたは 2 つのヘッダーに対してこれを行うのが最善です。

于 2008-10-20T23:34:06.923 に答える
6

http ヘッダーにはアクセスできませんが、ヘッダーで提供される情報の一部は DOM で利用できます。たとえば、http リファラー (sic) を見たい場合は、document.referrer を使用します。他の http ヘッダーには、このようなものがあるかもしれません。「http referer javascript」など、必要な特定のものをグーグルで検索してみてください。

これは明らかなはずですが、本当に必要なのはリファラーだけだったのに、「http headers javascript」などを検索し続け、有用な結果が得られませんでした。より具体的なクエリを作成できることにどうして気づかなかったのかわかりません。

于 2013-01-30T00:06:00.910 に答える
5

リクエストヘッダーについて話している場合、XmlHttpRequestsを実行するときに独自のヘッダーを作成できます。

var request = new XMLHttpRequest();
request.setRequestHeader("X-Requested-With", "XMLHttpRequest");
request.open("GET", path, true);
request.send(null);
于 2008-10-21T05:44:30.670 に答える
3

mootoolsを使用すると、次のことができますthis.xhr.getAllResponseHeaders()

于 2008-11-10T12:37:16.963 に答える
-1

これは古い質問です。サポートがいつ広まったかは不明ですがgetAllResponseHeaders()、getResponseHeader()現在はかなり標準になっているようです: http://www.w3schools.com/xml/dom_http.asp

于 2011-01-31T02:17:32.610 に答える