【初学者によるまとめ】この一冊で全部わかるWeb技術の基本 「Chapter3」＞「01 HTTPメッセージ」「02 HTTPリクエスト／HTTPレスポンス」

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

注意点
🤔 ←この絵文字の文章は個人的な見解になります。的外れなこともあるかと思います。
Chapter3 の「01 HTTPメッセージ」「02 HTTPリクエスト／HTTPレスポンス」が入り混じった内容になります

---

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

（参考サイト）
ネットワークエンジニアとして

---

HTTPメッセージ - HTTPでやりとりするデータの構造

• HTTPはHTMLをはじめとするテキストファイル、画像や動画などのやり取りをするときに使われるプロトコル
  • 身近なのはやはりYouTube、Instagram

パソコンやスマートフォンが手元にあるのが当たり前になった時代において、Webサイト閲覧などで利用されるHTTPは私たちにとって一番馴染みのあるプロトコルといってもよいでしょう。（P50より）

HTTPメッセージによる「要求」と「応答」

• HTTPはWebブラウザとWebサーバーとの送受信でWebサイトの閲覧を可能とするプロトコル
  ↓ ↓ ↓ ↓ ↓
  Ｑ．"送受信"とはいうもの何をリクエスト＆レスポンスとして送受信しているのか？
  Ａ．HTTPメッセージという送信内容＆受信内容を載せるデータを内部的に渡している
  ⇒以下に表で示すみたいに４層で構築されている

	HTTPリクエストのメッセージ	HTTPレスポンスのメッセージ
1	リクエスト行	ステータス行
2	メッセージヘッダ	メッセージヘッダ
3	空白行	空白行
4	メッセージボディ	メッセージボディ

【HTTPリクエストおよびレスポンス時のHTTPメッセージの構造について】

1. リクエスト行：Webサーバーに要求する情報を載せる
    +
    +-- メソッド　　　　 - GET、POST、PUT、DELETEなどWebサーバーへの要求内容を意味する
    +-- URI　　　　　　　- リクエスト対象となるデータを指す情報
    +-- HTTPバージョン　 - HTTPにもバージョンという概念がある
    
2. メッセージヘッダ：リクエストを発信したWebブラウザについての情報を載せる（ブラウザ種類など）
    
3. 空白行：シンプルな空白行。メッセージヘッダの区切りを意味するため
    
4. メッセージボディ：Webサーバに送るデータを載せる。（<input>など）

　　　（↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓）　　　HTTP通信　　（↑ ↑ ↑ ↑ ↑ ↑ ↑ ↑ ↑ ↑ ↑）

1. ステータス行：
    +
    +-- HTTPのバージョン　- リクエスト同様
    +-- ステータスコード  - 代表的なのは404エラー
    +-- 説明文
    
2. メッセージヘッダ：レスポンスを発信したWebサーバーについての情報を載せる（サーバーの種類など）

3. 空白行：リクエスト同様

4. メッセージボディ：ブラウザに対して返すHTML文書、画像ファイル、動画ファイルなどが格納されている

2種類のHTTPメッセージ

• 上述した通り、HTTPメッセージは２種類ある
  • Webブラウザからの要求 = HTTPリクエスト
  • Webサーバーからの応答 = HTTPレスポンス
• HTTPは基本に１リクエストに対して１レスポンスを返す