URLを叩く→サイトが表示される→なんで？
みなさん、こんにちは。どんぶラッコです。
大好評(?) 知ったかぶりしたいテクノロジー談義シリーズです。
先日、スクレイピングについてLTをしてきました。
スクレイピングがなんぞや？という人はここら辺の記事を読んでみてください！
要するに、ウェブ上の情報を引っ張ってくる技術ですね！
その中で、そもそも情報はどのようにしてブラウザに表示されるのか、ということを説明したところ、好評だったので、こちらでもご紹介しようと思います！
URLを叩いたらページが表示されるまで
では、実際に流れを追ってみましょう！
まずユーザが 「http://hoge.comにアクセスしたい！」ということでURLを入力します。
URL(正確にはURIですね)とは、サーバの場所を示す住所のようなものです。Chromeさんは、この住所情報を基に、サーバへ情報を取得しに行くのです。これをリクエスト ( Request ) と呼ぶわけです。
なんでURLを元にサーバを探せるのか、という疑問についてはまた別の記事でご紹介しますね。
↑の図のリクエストをみてみると、なにかゴニョゴニョ書いてありますね。
これはリクエストのヘッダと呼ばれる部分に記述されている情報の一部です。これは、
hoge.com に接続して、
そのルートディレクトリ (/) の情報を
取得( GET ) してください
と言ってるわけです。
お肉屋さんに行って、
「右下にある牛バラ200gちょうだい！」
って言ってるのと同じです。…わかりづらい？
とにかく、サーバはリクエストに書かれている要求に基づいて情報を返してくれるわけです。
こうし初めてChromeはHTMLの情報をGETできたわけです。
あまり意識することはありませんが、これは curl -v コマンドを使うと確認することができます。
ぜひ一度ターミナル上で実行してみてください！
さて、ここまでくればあと一息です！HTMLを人が見ても理解できる形に変換する作業です。
この変換（レンダリング）作業こそが、Webブラウザを我々が使う最大の理由です。
よく、Webブラウザによって表示のされ方が違う！なんてこと、ありませんか？
例えば我々のサイトをChromeでみると、
こんな感じですが、Safariで見てみると、こうなります。
フォントサイズの濃さなどがちょっと違うことがわかると思います。
これは、Webブラウザによってレンダリングエンジンが違うから起こることなんですね。
そして、このようにWebブラウザがレンダリングをしてくれるからこそ、我々にHTMLやCSSで綺麗にデコレーションされたサイトが届く、というわけです。
普段あまり意識することがないですが、裏っ側で色々な処理をしているんですね！！
普段自分が使っている仕組みを「これってどうなっているんだろう…」と掘り下げてみると、新しい発見があるかもしれません♪
