🌏

【AWS④】 HTTPの動きについて理解を深める

2022/09/05に公開

どうもoreoです。

前回までの記事でAWS上にWebサーバーを構築しました。第4回のこの記事では、HTTPの動きについて深掘りしたいと思います。

【AWS①】ネットワークを構築してみる

【AWS②】サーバーを構築してみる

【AWS③】EC2インスタンスにWebサーバーをインストールしてアクセスできるようにする

自分へのメモ的な記事になりますが、普段インフラを触らない人の参考になれば幸いです!

1 HTTPについて

1-1 HTTPとは

HTTPは、HTMLなどといったWebサービスに必要な情報を伝達するためのプロトコルです。

HTTPはクライアント・サーバー型のアーキテクチャで、クライアントとサーバー間でリクエストとレスポンスのやり取りをします。

1-2 リクエスト(HTTPリクエスト)とは

リクエストは、クライアントからサーバーに向けて伝達される情報です。「リクエストライン」、「リクエストヘッダ」、「リクエストボディ」 の3つから構成されます。

リクエストライン

リクエストラインには、「HTTPメソッド」、「リクエスト先のURL」、「HTTPのバージョン」の3つが含まれます。

HTTPメソッドとはコンテンツに対する操作コマンドになります(以下表参照)。

メソッド 意味
GET リソースを取得する
POST リソースにデータを送信したり、子リソースを作成したりする
HEAD リソースのヘッダー情報だけを取得する
PUT リソースを更新したり、作成したりする
DELETE リソースを削除する
OPTIONS サーバーがサポートしているメソッドを取得する
TRACE 自分宛にリクエストメッセージを返してルーブバックテストする
CONNECT プロキシ動作のトンネル接続を変更する

ブラウザのアドレス欄にURLを入力してコンテンツを取得するときには一般的に「GETメソッド」が使われ、入力フォームなどでデータを送信する場合は、「POSTメソッド」が使われます。

POSTメソッドでは、クライアントからWebサーバーに向けて送信するデータをリクエストボディに付けて送信します(ファイルの送信も可能です)。

リクエストヘッダ

クライアントから送信するリクエストの追加情報を記載します。代表的なリクエストヘッダは下記になります。

リクエストヘッダ 内容
Host リクエストが送信される先のサーバーのホスト名とポート番号
User-Agent ブラウザの種類など
Authorization 認証情報
Cookie Cookie情報
Referer 直前に見ていたページのURL
Accept クライアントで利用可能なコンテンツタイプ(MIMEタイプ)
Accept-Charset クライアントで利用可能な文字エンコーディング
Accept-Encoding クライアントで利用可能な圧縮方式

リクエストボディ

リクエストで送信するデータが記載されます。例えば、入力フォームなどの内容が記載されます。また、リクエストヘッダーとリクエストボディは空行(改行だけの行)で区切られます

1-3 レスポンス(HTTPレスポンス)とは

レスポンスは、リクエストを受けてサーバーからクライアントに向けて伝達される情報で、「ステータスライン」、「レスポンスヘッダ」、「レスポンスボディ」 の3つから構成されます。

ステータスライン

ステータスラインには、「ステータスコード」、「HTTPのバージョン」の2つが含まれます。ステータスコードはリクエストの成否を返します。正常に成功すれば「200 OK」、見つからないときは「404 Not Found」、サーバー側で何かしらのエラーが発生した時は「500 Internal Server Error」などの値になります(ステータスコードの詳細は下記)。

コード 意味 解説
1xx 処理中 何か処理中のことを伝える時に用いる。
2xx 成功 成功したことを示す。「200 OK」など。
3xx リダイレクト 別のURLにリダイレクトする。「301 Moved Permanently」(永続的な移動)、「302 Found」 (一時的な移動)、「303 See Other」(他を参照せよ)、「304 Not Modified」(コンテンツは、If-Modified-Sinceヘッダーで指定されて日時から更新されていない)など。
4xx クライアントエラー クライアント側のリクエストにエラーがある。「401 Unautorized」(認証が必要)、「403 Forbidden」(アクセス禁止)、「404 Not Found」(指定されたリソースが見つからない)など。
5xx サーバーエラー サーバー側のエラー。「500 Internal Server Error」(内部的なエラー)、「503 Service Unavaliable」(一時的に接続できないときやサーバーが受け入れ可能な接続数を超えた時などに使われる)など

レスポンスヘッダ

サーバーから送信するレスポンスの追加情報を記載します。代表的なレスポンスヘッダは下記になります。

レスポンスヘッダ 内容
Server リクエストを処理したサーバー情報
Content-Type クライアントに返されたコンテンツの種類(MIMEタイプ)
Content-Length レスポンスボディの長さ
Cache-Control クライアントのキャッシュ管理方法など
Expires キャッシュの有効期限
Set-Cookie Cookie情報

レスポンスボディ

リクエストされたURLに対するHTMLや画像などのデータが記載されます。リクエストボディと同じようにレスポンスヘッダーとレスポンスボディは空行で区切られます

2 Chrome DevToolsでHTTPのやりとりを覗く

Google ChromeのDevToolsを使って、Webページにアクセスした際のHTTPの動きを覗いてみたいと思います。DevToolsは、「Option+Command+i」で開くことができます。ここでは例として、https://qiita.com/にアクセスしてみます。

DevToolsの「Network」タブ>任意ファイルの「Name」>「Headers」タブで、通信概要、レスポンスヘッダ、リクエストヘッダが確認できます。

「Headers」タブの「General」部分で通信の概要が確認できます。「Request URL」からリクエスト対象のURLがhttps://qiita.com/であること、「Request Method」からHTTPメソッドがGETであること、「Status Code : 200」からこの通信が成功したことが読み取れます。

「Headers」タブの「RequestHeaders」で、リクエストヘッダの詳細を確認できます。例えばacceptを見るとこのクライアントはtext/htmlなどが利用可能であることがわかります。

「Headers」タブの「ResponseHeaders」でレスポンスヘッダの詳細を確認できます。例えばContent-Typeを見るとクライアントに対してtext/htmlが返されたことがわかります。

レスポンスボディに関しては、「Response」タブから確認することができ、HTMLがクライアントに帰されていることがわかります。

3 Telnetを使ってHTTPのやりとりをする

telnetコマンドを使うと、Webブラウザが送信するようなHTTPリクエストを手動でサーバーに送信することができます。

まず、telnetがない場合は、下記コマンドでインストールします。

brew install telnet

首相官邸のwebサイト(www.kantei.go.jp)のWebサーバーの80番ポートに接続します。

telnet www.kantei.go.jp 80

接続をできたら、以下の文字列(最後の空行を忘れずに)を入力するとwww.kantei.go.jpのWebサーバーからレスポンスを取得できます。「GET / HTTP/ 1.1」は、HTTPのバージョン1.1を用いて、「/」というコンテンツをGETメソッドで取得するというコマンドです。「HOST: www.kantei.go.jp」は、Hostヘッダであり、リクエスト送信先のサーバーを指定しています。

GET / HTTP/1.1
HOST: www.kantei.go.jp

下記のようなレスポンスヘッダとレスポンスボディを取得できます。

telnetは、Ctrl + ]でtelnetプロンプトを表示させqを入力すると終了することができます。

4 最後に

HTTPの動きについて改めて整理してみました!リスエストヘッダやレスポンスヘッダの内容を理解しておくと、パフォーマンスチューニングなどあらゆる場面で役に立ちますね。

次回は、前回作成したネットワークにプライベートサブネットを作成してそこにDBサーバーを構築します!

5 参考

https://bookplus.nikkei.com/atcl/catalog/17/261530/

https://developer.mozilla.org/ja/docs/Web/HTTP

https://developer.mozilla.org/ja/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Common_types

Discussion