💬
【初学者によるまとめ】この一冊で全部わかるWeb技術の基本　「Chapter3」＞「05 メッセージヘッダー」

2024/12/09に公開
web技術の基本
目的：「イラスト図解式 この一冊で全部わかるWeb技術の基本」の要点を自分なりにまとめ、Qiitaへアウトプットして理解力の向上に努める。


注意点


🤔 ←この絵文字の文章は個人的な見解になります。的外れなこともあるかと思います。

（参考書籍）
イラスト図解式 この一冊で全部わかるWeb技術の基本
（参考サイト）
MDN

 メッセージヘッダー以前まとめた記事より、HTTPメッセージの４層構造の内の上から２層目のメッセージヘッダーにHTTPメッセージに関する詳細な情報を載せて送っている
※この場合の「HTTPメッセージに関する詳細な情報」は「リクエストしてきたクライアントの情報やリクエストされたリソースの情報」など少しメタ的な情報を指している
パラメータはHTTPメッセージのメッセージボディに格納するので違う

メッセージヘッダーはメッセージフィールドと呼ばれる行で構成
ヘッダーフィールドは「フィールド名」「コロン（:）」「１文字分の空白」「フィールド値」の４要素で構成
ヘッダーフィールドの構文
(フィールド名Ａ)：␣(フィールド値１)␣(フィールド値２)␣...␣(フィールド値Ｎ)
(フィールド名Ｂ)：␣(フィールド値１)␣(フィールド値２)␣...␣(フィールド値Ｎ)

※`␣` = 半角空白
〇ヘッダーフィールドの構成

ヘッダーフィールドは、HTTPメッセージでのやりとりにおける詳細な情報を示すために使われます。

Data: Sun, 01 Jan 2017 00:00:00 GMT
（P59より引用）
🤔<(ほぼJSのキーバリューと同じ。バリューが複数載せられるから1対1ではないけど。)

 ヘッダーフィールドの種類★：代表的なフィールド

 ・一般ヘッダーフィールド（後述のエンティティヘッダーフィールド同様）HTTPリクエストとHTTPレスポンスの両方に含まれるヘッダーフィールド
"一般情報が入っている"ぐらいのイメージ
例）
★Date（日付）
Connection（接続情報に関する通知）
Upgrade（HTTPバージョンのアップデート要求）



 ・リクエストヘッダーフィールドHTTPリクエスト'のみ'に含まれるヘッダーフィールド
クライアント側が送るべき情報を載せている
具体的にはクライアント側が「使ってる端末はスマホ？PC？」「使ってるブラウザはChrome？Edge？」など
例）
Host（リクエスト先のサーバー名）
Referer（直前にリンクしていたWebページのURL）
★User-Agent（Webブラウザの固有情報としてそのプロダクト名やバージョンなど）



 ・レスポンスヘッダーフィールドHTTPレスポンス'のみ'に含まれるヘッダーフィールド
リクエストヘッダーフィールドの逆版でサーバー側の情報を載せる
例）
Location（リダイレクト先のWebページの情報）
★Server（Webサーバーの固有情報としてそのプロダクト名やバージョンなど）



 ・エンティティヘッダーフィールドHTTPリクエストとHTTPレスポンスの両方に含まれるヘッダーフィールド（先述の一般ヘッダーフィールド同様）
一般ヘッダーフィールドの様なメタ情報というより、ユーザー寄りな情報を含んでいる
サーバーがWebブラウザに対して返答する"Webコンテンツについての基礎情報"を載せている
例）
Allow（利用可能なHTTPメソッドの一覧）
Content-Encoding（コンテンツのエンコード方式・データ変換方式）
Content-Language（コンテンツの使用言語）
Content-Length（コンテンツのサイズ　[単位：byte]）
★Content-Type（コンテンツの種類(テキスト、画像など)）
Expires（コンテンツの有効期限）
Last-Modified（コンテンツの最終更新時刻）


[個人的疑問・所感など]

・HTTPメッセージのレスポンスヘッダーフィールドに含まれる"Location"とJavaScriptで扱う"Location"オブジェクトは何か関係があるのか？

⇒ChatGPTいわく無関係ではないが意味が同じがというとそうではないらしい

（これに関しては調査が必要）
HTTPメッセージのレスポンスヘッダーフィールドに含まれる"Location"とJavaScriptで扱う"Location"オブジェクトは何か関係があるのか？
【ChatGPT】

　HTTPメッセージのレスポンスヘッダーフィールドに含まれる"Location"とJavaScriptで扱う"Location"オブジェクトは、関連性がありますが、それぞれ異なる文脈で使用されます。

　HTTPレスポンスヘッダーの"Location": これは、HTTPリダイレクト応答で使用されます。Webサーバーがクライアントにリダイレクトを指示する際に、新しいリソースのURLを提供するために使用されます。例えば、サーバーがリソースの移動や一時的なリダイレクトを示す際に使用されます。

　JavaScriptの"Location"オブジェクト: これは、ブラウザのJavaScriptで使用される特殊な組み込みオブジェクトで、現在のURLを表します。これを使用することで、現在のページのURLやページの遷移、URLのパラメーターの取得などが可能です。window.locationでアクセスできます。

　関連性は、ブラウザがHTTPリダイレクトを受け取った場合、ブラウザは新しい場所に移動する必要があるため、JavaScriptの"Location"オブジェクトが自動的に更新されることです。これにより、JavaScriptコードが新しい場所に移動するときのURL情報にアクセスできます。

　つまり、HTTPのレスポンスヘッダーの"Location"とJavaScriptの"Location"オブジェクトは、ブラウザのページのリダイレクトに関連していますが、それぞれ異なるコンテキストで使用されます。
メッセージヘッダー

ヘッダーフィールドの種類

・一般ヘッダーフィールド（後述のエンティティヘッダーフィールド同様）

・リクエストヘッダーフィールド

・レスポンスヘッダーフィールド

・エンティティヘッダーフィールド

Discussion
