[解決済み] JavaScriptでウェブページのHTTPヘッダーにアクセスする

2022-03-20 18:24:17

質問

JavaScriptでページのHTTPレスポンスヘッダーにアクセスするにはどうすればよいですか？

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

<ブロッククオート

どのように解決するのですか？

残念ながら、最初のページ・リクエストに対するHTTPレスポンス・ヘッダを提供するAPIは存在しません。これがここに投稿された最初の質問でした。それは、これまで繰り返し質問というのも、何人かの人は、別のページ・リクエストを発行することなく、オリジナルのページの実際のレスポンス・ヘッダを取得したいと思うからです。

AJAXリクエストの場合。

AJAXでHTTPリクエストを行った場合、レスポンスヘッダを取得するために getAllResponseHeaders() メソッドを使用します。これは、XMLHttpRequest APIの一部です。これがどのように適用されるかについては fetchSimilarHeaders() 関数は以下の通りです。なお、これは問題の回避策であり、一部のアプリケーションでは信頼できないでしょう。

myXMLHttpRequest.getAllResponseHeaders();

以下のXMLHttpRequestの勧告候補でAPIが規定された。 XMLHttpRequest - W3C Candidate Recommendation 3 August 2010 (英語)
具体的には getAllResponseHeaders() というメソッドが指定されていました。 w3.org XMLHttpRequest : この getallresponseheaders() メソッド
MDNのドキュメントも良いですよ。 developer.mozilla.org。 XMLHttpRequest .

これは、元のページリクエストのHTTPレスポンスヘッダに関する情報を得ることはできませんが、それらのヘッダが何であったかを推測するために使用することができます。これについては、次に詳しく説明します。

Initial Page Requestからヘッダー値を取得する。

この質問は、数年前に初めてなされたもので、特に 現在のページ (すなわち、javascriptが実行されているのと同じページ)。これは、単にHTTPリクエストのレスポンスヘッダを取得するのとは全く異なる質問です。最初のページへのリクエストでは、ヘッダはjavascriptが容易に利用できるものではありません。AJAXで同じページを再度リクエストしたときに、必要なヘッダー値が確実かつ十分に一貫しているかどうかは、あなたの特定のアプリケーションに依存します。

この問題を回避するためのいくつかの提案を以下に示します。

1. 主に静的なリソースへのリクエスト

もしレスポンスがほとんど静的で、ヘッダがリクエスト間であまり変わらないと予想される場合、現在いるのと同じページに対して AJAX リクエストを行い、そのページの HTTP レスポンスの一部であったのと同じ値であると仮定することができます。これによって、上記の素晴らしい XMLHttpRequest API を使って必要なヘッダにアクセスすることができます。

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プロパティ (Browser Object Model)と呼ばれるもので、ブラウザがヘッダを見て判断するものです。これらのプロパティの中には、HTTP ヘッダを直接反映するものがあります（例えば navigator.userAgent の値として設定されます。 User-Agent ヘッダーフィールド)。利用可能なプロパティを嗅ぎ回ることで、必要なもの、あるいはHTTPレスポンスが何を含んでいるかを示す手がかりを見つけることができるかもしれません。

3. 収納する

サーバーサイドをコントロールすれば、フルレスポンスを構築する際に、好きなヘッダーにアクセスすることができます。値はページと一緒にクライアントに渡されたり、マークアップやインラインのJSON構造体に格納されたりすることができます。HTTPリクエストのヘッダをすべてjavascriptで利用したい場合は、サーバー上でヘッダを繰り返し処理し、マークアップのhidden値として返送することができます。この方法でヘッダー値を送信することは、おそらく理想的ではありませんが、必要な特定の値のためにそれを行うことができるのは確かです。この方法も間違いなく非効率的ですが、必要であれば仕事をすることができます。