ブラウザに入力してからページが表示されるまでに起こっていること

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

WebブラウザがWebサーバーに対してデータを要求し、WebサーバーがWebブラウザにデータを返すことでサイト閲覧などができる。WebブラウザとWebサーバーのやりとりで使われるプロトコル(ルール)を、HTTP(Hyper Text Transfer Protcol)という。HTTPにおいては「HTTPメッセージ」というデータ形式が使われる。

HTTPメッセージはWebブラウザからの要求である「HTTPリクエスト」と、Webサーバーからの応答である「HTTPレスポンス」に分けることができる。

1.HTTPリクエストが送られる

HTTPリクエストは「リクエスト行」、「メッセージヘッダー」、「メッセージボディ」の3つに分けることができる。
http://example.comを表示したい場合、HTTPプロトコルを利用し、example.comというサーバーからindex.htmlファイルを取得するという意味になる。

①リクエスト行
GET/*webサーバーに対する要求*/ /index.html/*リクエスト対象のデータ*/  HTTP/1.1/*HTTPのバージョン*/
-----------------
②メッセージヘッダー(HTTPヘッダー)
Host:example.com /*リクエスト先のドメイン名*/
User-agent:Mozilla/5.0(windows NT6.1; win64; x64) /*webブラウザのバージョンなどの固有情報*/
accept:text/html,application/xhtml+xml,application/xml
accept-encoding: gzip, deflate, sdch  /*コンテンツのデータ変換方式*/
accept-language: ja,en-US;q=0.8,en;q=0.6 /*コンテンツの使用言語*/
connection:keep-alive /*TCPコネクションの接続状態に関する通知*/
-----------------
③空白(1行開けることでメッセージの終わりを伝える)
-----------------
④メッセージボディ

①リクエスト行
webサーバーに対してどのような処理を依頼するのかという情報を含む

②メッセージヘッダー(HTTPヘッダー)
ブラウザの種類や対応しているデータのタイプ、データの圧縮方法、言語などの情報

③空白行
1行開けることでメッセージの終わりを伝える

④メッセージボディ
webサーバーにデータを送信するために使う。からの場合もある。

2.HTTPレスポンスが返る

WebサーバーからHTTPレスポンスが返される。

①ステータス行
HTTP1.1 /*HTTPのバージョン*/ 200 /*ステータスコード*/ OK /*ステータスコードの内容をテキストで表現*/
-----------------
②メッセージヘッダー(HTTPヘッダー)
Server:Apache /*webブラウザのバージョンなどの固有情報*/
Date:Mon, 15 Mar 2019 17:45:00 GMT /*HTTPメッセージが作成された日*/
Content-type:text/html; charset=UTF-8 /*コンテンツの種類(テキスト、画像など)*/
Content-encoding: gzip  /*コンテンツのデータ変換方式*/
-----------------
③空白行
-----------------
④メッセージボディ

①ステータス行
webブラウザに処理の結果を伝える。

②メッセージヘッダー(HTTPヘッダー)
webサーバーのソフトウェア情報や送信するデータのタイプ、圧縮方法などを伝える。

④メッセージボディ
HTMLや画像などのデータを格納する。このメッセージボディがユーザーが目にする部分。

DNSによる名前解決

コンピュータ同士の接続にはIPアドレスが使用されるので、ドメインのままではWebサーバーは紐づくデータを見つけることができない。そこで、ドメインをIPアドレスに変換する必要がある。そこでHTTPリクエストに含まれるドメインがWebサーバーに送られる前にドメインをIPアドレスに変換する仕組みをDNS(Domain Name System)という。

元画像:イラスト図解式 この一冊で全部わかるWeb技術の基本

URLを入力すると、必ずDNSへのIPアドレスの問い合わせの問い合わせを行っている。そしてDNSサーバーから取得したIPアドレスを元にWebサーバーに接続している。このようにDNSによってドメイン(URL)とIPアドレスを紐づけることを名前解決という。

コネクションの確立

HTTPメッセージのやりとりの前に、WebブラウザとWebサーバーが通信可能な状態かどうかを確認し、「コネクション」と呼ばれる通信経路を確立する。コネクションの確認は3回のやりとりによって完了する。

①SYN
WebブラウザからWebサーバーに対して接続を要求するためにSYNパケットと呼ばれるデータを送る。
②SYN+ACK
ブラウザから送られてきたSYNパケットへの確認応答にあたるACKパケットと、サーバーからブラウザに対する接続確認としてのSYNパケットを送る。
③ACK
ブラウザからサーバーへの確認応答であるACK。お互いにSYNとACKを投げ合うことで通信可能なことを確認し、コネクションが確立する。


かなりざっくりと解釈したことをまとめたので色々ガバガバですが、ご容赦ください。。これから勉強しながらこの記事も更新していきたいと思います。