HTTPを構成する4つの基本要素とは？
概要
普段当たり前のように名前を聞いたり言ったりするHTTPですが、よく考えるとあまり中身を知らない概念だなと思いました。
なのでもう少し深くその構造を知るべく、HTTPを構成している4つの基本要素について、かんたんに情報を整理しました。
HTTPとは？
HTML 文書などのリソースを取り出すことを可能にするプロトコルです。
これはウェブにおけるデータ交換の基礎をなし、クライアントサーバープロトコルであり、リクエストは受け取り者 (一般にはウェブブラウザー) が生成します。文書全体は、テキスト、レイアウトの定義、画像、動画、スクリプトなど、取り込まれたさまざまなサブ文書から再構成されます。
上記をとてもざっくりまとめると、Webで何かコンテンツを見たいときに必要となるプロトコルということでしょうか。
つまり以下の流れを実現してくれるもののようです。
- Webで何かみたいAさんがいる
- Aさんがブラウザを使って、クライアントとしてサーバーに「これを見せて！」とリクエストを投げる
- サーバーがそれに対してレスポンスを返す
- レスポンスの中にHTML文書が入っており、ブラウザがその中身を取り出す（文書にはテキスト、画像などいろいろある）
- Aさんがコンテンツを見れる
私たちが普段Webで動画を見たり、インターネットで調べものをしたりするうえで、必ず関わってくるプロトコル。
すごいですね。日常がHTTPに支えられているといっても過言ではなさそうです。
HTTPの基本要素
本題です。
HTTPは、どのようなもので構成されているのでしょうか？
それは以下の4つです。
- メソッドとパス
- ヘッダー
- ボディ
- ステータス
それぞれ以下で整理をしていきます。
メソッドとパス
メソッドとは、リソースに対して何をするのかを、サーバーに指示するためのものです。
ここではメソッドの中でも特に有名な4つだけ、役割をかんたんに整理します。
- GET: 指定したリソースの表示
- POST: 指定したリソースに新しいドキュメントを投稿
- PUT: 指定したリソース全体を更新
- DELETE: 指定したリソースを削除
そしてパスは、今回何かアクションを起こしたいリソースの場所です。
/や/posts/など、基本的にURLでホスト名の後ろについているデータになります。
たとえば以下URLでは、rinda_1994/articles/0863ba756cb505がパスになります。
https://zenn.dev/rinda_1994/articles/0863ba756cb505
ちなみにこれで言うと、httpsのことをスキーム、zenn.devをホスト名と呼びます。
スキームは通信形式を表し、ホスト名はサーバーのグローバルIPアドレスを取得するのに必要な文字列です。
何に対して、何をするのかを記述するのが、メソッドとパスと考えてよいかもしれません。
ヘッダー
ヘッダーはサーバーとクライアント間での、追加情報や指示などを書く場所です。
HTTPリクエスト/レスポンスのどちらともで使われており、フィールド名: 値という形式でボディの前に付加されています。
ヘッダーの種類も多様なので、ここでは用途がわかりやすいものをご紹介します。
リクエスト
- User-Agent
- クライアントが自分のアプリケーション名を入れるところです。クライアントは基本的にはブラウザになるので、ここにはブラウザの名前が入っている場合が多いです。
- Referer
- クライアントがリクエストを送る時に見ていたページのURL、つまり参照元URLを入れるところです。
- 分析やログなど、害のない用途に使われることが望ましいですが、情報の追跡などにも使用できてしまうため、注意が必要な項目です（詳しくはMozillaに掲載されています）
- Authorization
- 特別なクライアントにだけ通信を許可する際、認証情報をサーバーに伝えるための項目です。
レスポンス
- Content-Type
- コンテンツの種類を示しているところです。ここにはMIMEタイプと呼ばれる識別子を入れます。
- コンテンツの種類には、text（文章やソースコード）, image（画像）, audio（音声）, video（動画）などいろいろあります。
- Content-Length
- ボディのサイズです。
- Date
- レスポンスが返された日時です。
両方
- Connection
- 受け取った通信に対して応答をした後に、TCPコネクションを切断するかどうかを入れるところです。
ボディ
コンテンツの中身が書かれてある場所です。
ヘッダーで出てきた、Content-Typeによって指定された種類のデータが入っています。
ステータス
サーバーがクライアントに、どのようなレスポンスをしたのかを知るための数字です（厳密には数字それ自体はステータスコードと呼ばれます）。
ここを見るとざっくり、通信が成功したのか否かがわかります。
ステータスは大きく以下5つのカテゴリに分類できます。
100番台
処理中の状態です。
処理が始まった時点ではこちらのステータスになります。
しかしその時間は非常に短いため、普段開発をしていて意識する必要性は低そうです。
200番台
成功時のレスポンスです。
OKの意である、200を見ることが一番多いでしょうか。
300番台
リクエストを完了させるために、クライアントからサーバーへ追加の処理が必要な状態です。
こちらの状態はエラーではなく、正常処理の範疇となります。
例えば301は、クライアントに対して恒久的なリダイレクトを命令するステータスです。
これを使うと旧サイトから新サイトに強制的に遷移させることを実現できたりします。
400番台
クライアントから送られたリクエストにおかしなところがある、ということを示したエラーの状態です。
対象のWebページが見つからないという意味の404(Not Found)、閲覧権限がないという意味の403（Forbidden）が有名でしょうか。
500番台
サーバー内部でエラーが発生した状態です。
個人的には、ゲートウェイが不正なリクエストを拒否したという意味の502(Bad Gateway)はたまに見る気がします。
zenn.devからのレスポンスで、各要素を確認してみる
zenn.devにcurlでリクエストを投げてみました。
そのレスポンスの内容は以下の通りです。
HTTP/1.1 301 Moved Permanently
Cache-Control: private
Content-Type: text/html; charset=UTF-8
Referrer-Policy: no-referrer
Location: https://zenn.dev/
Content-Length: 214
Date: Sun, 20 Feb 2022 10:19:51 GMT
<HTML><HEAD><meta http-equiv="content-type" content="text/html;charset=utf-8">
<TITLE>301 Moved</TITLE></HEAD><BODY>
<H1>301 Moved</H1>
The document has moved
<A HREF="https://zenn.dev/">here</A>.
</BODY></HTML>
上からいきましょう。
HTTP/1.1
httpのバージョンです。
301 Moved Permanently
ステータスです。恒久的なリダイレクトを指示されています。
Cache-Control: private
Content-Type: text/html; charset=UTF-8
Referrer-Policy: no-referrer
Location: https://zenn.dev/
Content-Length: 214
Date: Sun, 20 Feb 2022 10:19:51 GMT
ヘッダーです。
https://zenn.dev/にリダイレクトしているということや、コンテンツの種類がHTMLであることが示されています。
<HTML><HEAD><meta http-equiv="content-type" content="text/html;charset=utf-8">
<TITLE>301 Moved</TITLE></HEAD><BODY>
<H1>301 Moved</H1>
The document has moved
<A HREF="https://zenn.dev/">here</A>.
</BODY></HTML>
ボディです。
301の詳細内容が書かれています。
所感
HTTPへのふんわり理解が、少しかっちりになった気がします。
ただあまりに大きすぎる概念なので、もっともっとがっつり知るためには、たとえば 0.9 -> 1.0 -> 1.1 -> 2.0 -> 3.0 などの、HTTPの歴史を追っていく必要がありそうだなと感じました。
参考文献・参考記事
Discussion