【概説】どのようにwebサイト (ウェブサイト) は動いているのか

1. 本記事の目的

今回は、初心者エンジニアの方に対して、
webサイトの全体像をざっくり理解して頂くことを目的として、
本記事を作成しました。
既に経験のあるエンジニアの皆様にとってはつまらない内容かもしれませんがご容赦ください。

2. 全体像

まずは、以下の図にて、Webサイトがどのように動いているかの全体像をご説明致します。

IPアドレスの取得

利用者が何らかのサイト (上記では google.com) にアクセスしたいとします。
しかし、 google.com のままでは、パソコンはどこに情報を取得しに行けばよいかがわかりません。
なぜならば、インターネットの世界では、IPアドレス と呼ばれる数字で住所を管理しているからです。
勿論、あなたのパソコン / スマホにもIPアドレスが付与されています。 (ここで確認できます)

そこで、google.com (このような人が理解できるアドレスのことを ドメイン と呼びます) を
IPアドレスに変換する作業が必要になります。
これを実施する場所を DNSサーバー と呼びます。

DNSサーバーでは、ドメインとIPアドレスの紐づけ情報を保持しており、
ドメインに対応するIPアドレスをユーザーに教える役割を持っています。

利用者が何らかのサイトにアクセスする際は、まず最初にDNSサーバーで
ドメインに対応するIPアドレスを取得する、ということを覚えて頂けると幸いです。

情報の取得

IPアドレスがわかったら、いよいよWebサイトの情報を取得します。
Webサイトの情報を取得する際は　HTTPプロトコル という
世界で決められている手順を使用して通信します。
今回の例の場合、GoogleのサーバーにHTTPプロトコルを用いて情報取得を依頼し、
Googleがその依頼を処理して結果を利用者に返却する、という流れになります。
また、返却されるデータは、HTMLやCSS、JavaScriptや画像ファイルなどである場合が多いです。
HTMLやCSSといったデータの形式については、別の記事で触れます。

3. Googleのサーバーでは何をしているの？

前章では、Googleのサーバーから情報を取得する、と簡単に書いてしまいましたが、
具体的に何をやっているのかをこの章で説明します。

利用者からのリクエストを受けたサーバーは、主に3層に分けて処理を実施します。
これをWeb3層アプリケーションと呼びます。
このうち、APサーバーやDBサーバーは、Webサイトの特性によってはない場合もありますが、
多くのwebサイトでは、この3層が連携しながら情報を作成し利用者に返却しています。
以下では、各サーバーごとの役割について記載します。

Webサーバー

Webサーバーは、HTTPプロトコルに則り、要求元に指定されたHTMLや画像などを表示する役割を持ちます。
HTTPプロトコルとは、通信をするための法律の1つだと理解して頂ければ良いと思います。
HTMLや画像などのデータはWebサーバーで保持している場合もあれば、
APサーバーを呼び出して取得する場合もあります。

有名どころでは、Apache, Nginx, IIS などが挙げられます。
(各ソフトウェアの詳細について本記事では言及しません)

例えば、ユーザーの投稿などによって、Webページの内容がどんどん変わる場合は、
Javaなどのプログラムを使用してHTMLを作成する必要があります。
このようなサイトでは、APサーバーを呼出してHTMLを取得します。

逆に、何度アクセスしてもコンテンツが変わらないサイトの場合、(企業のホームページなど)
HTMLは事前にファイルとして作成しておくことが可能です。
このような場合はAPサーバーを使用せず、Webサーバーからアクセスできる場所に保存された
HTMLファイルをそのまま利用者に返却します。

APサーバー (アプリケーションサーバー)

APサーバーは、Webサーバーからの命令に従ってHTMLを作成する役割を持ちます。
一般的なケースとしては、DBに保存された情報を使用してHTMLを作成するケースが多いです。
その他のケースとしては、外部のサービス (例えば天気予報の情報) から情報を取得して、
それを基にHTMLを作成するケースもあります。

有名どころでは、Ruby on Rails で使用できる Unicorn というAPサーバー、
そしてJavaで使用できる Tomcat、
JavaScriptで使用できる Node.js などが挙げられます。

DBサーバー (データベースサーバー)

DBサーバーはデータを保存する役割を持ちます。
例えば利用者のメールアドレスといったの個人情報や商品の情報などを保存します。
DBに保存した情報は、 SQL という言語を通じて保存・読み取り・更新・削除します。

有名どころでは、PostgreSQL, MySQL, Oracle が挙げられます。

その他

他にも、例えば以下のようなサーバーもありますが、今回は概説編なので説明を省略します。

• DNSサーバー
• メールサーバー
• 認証サーバー
• バッチサーバー
• 監視サーバー
• ジョブサーバー
• バックアップサーバー
• 連携サーバー

4. データを受け取った後はどうやって表示しているの？

さて、サーバーからデータを受け取った後は、人が理解できる形式で表示する必要があります。
サーバーから送付された HTMLやCSSの情報はそのままではとても理解しづらいですから。
以下の絵で簡単に流れを表現しました。

まず、サーバーから得たデータは ブラウザ にて処理します。
ブラウザとは、 Google Chrome や Firefox や IE といった、
皆さんが普段ネットをする時に使っているソフトウェアです。

まず、ブラウザは、 HTTPプロトコルの処理結果を確認します。
具体的には、 HTTPステータス という処理結果のコードのようなものをチェックします。
HTTPステータスの一覧は ココ を参照ください。
これが正常であればサーバーから取得したデータを利用者が見やすい表示に変換し、
ディスプレイに描画します。
異常である場合は、以下のようなエラーページを表示したりします。

まとめ

今回は、概説として、ざっくり、Webサイトがどのようにして成り立っているかを説明しました。
初心者の皆さんによって、大枠を理解するための助けになれば幸いです。
以下に頂いた質問に対する回答を記載しました。
良ければこちらもご覧ください。

よくある質問

DNSサーバーを使わずIPアドレスだけで管理した方が楽なのでは？

ドメインの良いところは人が理解できることです。
口頭でドメイン名を伝えてWebサイトへのアクセスをお願いすることができたり、
フィッシングサイトなどの詐欺サイトなどへのアクセスを抑止できる面でメリットも大きいと思います。

DNSサーバー自体はどうやって見つけるの？

DNSサーバーは、接続しているネットワークにて自動で設定されている場合がほとんどです。
接続しているネットワークのプロパティを確認すると、IPv4 DNSサーバーという項目があり、
そこでIPアドレスが記載されています。
これにより、DNSサーバーを見つけることができています。
また、このDNSサーバーは自分のコンピュータで変更することも可能です。
興味がある方はGoogleで調べて取り組まれてはいかがでしょうか。