Web のしくみでは、あなたがコンピュータや携帯電話の Web ブラウザで Web ページを見るときに起こることを簡単に説明します。

この理論は、短期間で Web のコードを書く上で必須ではありませんが、背景で何が起きているのかを理解しておくと、まもなく役に立つでしょう。

クライアントとサーバ

Web に接続されたコンピュータはクライアント (client)サーバ (server)と呼ばれます。これらがどのように相互作用するかを概略図で表すと次のようになります。

  • クライアントは、一般的な Web ユーザが使うインターネットに接続されたデバイス (例えば Wi-Fi に接続されているコンピュータや、モバイルネットワークに接続されているスマートフォン) と、これらのデバイスで利用できる Web にアクセスするソフトウェア (ふつうは Firefox や Chrome などの Web ブラウザ) のことです。
  • サーバとは、Web ページ、サイト、アプリを保存しているコンピュータのことです。クライアントデバイスが Web ページにアクセスしたいときは、Web ページのコピーがサーバからクライアントにダウンロードされ、ユーザの Web ブラウザに表示されます。

道具箱の他の部分

上で説明したクライアントとサーバは、すべてを話したわけではありません。これら二つ以外にも、他に多くのものが関わっています。以下では、それについて説明します。

いま、Web が道路であると想像しましょう。道路の端がクライアントで、それはあなたの自宅のようなものです。反対の端はサーバで、そこであなたは何かを買います。

クライアントとサーバに加えて、以下のものにも触れなければなりません。

  • インターネット接続: Web 上でデータの送受信をできるようにします。あなたの自宅とお店との間の通りのようなものです。
  • TCP/IP: Transmission Control Protocol と Internet Protocol は、どのように Web 上をデータが動くのかを定義した通信プロトコルです。これは注文したり、店に行ったり、物を買ったりするための通信手段や交通機関のようなものです。身近な例では、車やバイク (またはその辺りにあるもの) のようなものです。
  • DNS: Domain Name Servers は Web サイトの住所録のようなものです。ブラウザに Web アドレスを入力すると、ブラウザは Web サイトを取得する前に DNS を見て、Web サイトの本当のアドレスを探します。ブラウザは Web サイトがどのサーバにいるかを探し出す必要があり、それで HTTP のメッセージを正しい場所 (下記参照) に送ることができます。これはお店の所在地を探してからお店に行くようなものです。
  • HTTP: Hypertext Transfer Protocol は、クライアントとサーバが対話をする方法を定義するアプリケーションプロトコルです。これは商品を注文する言語のようなものです。
  • コンポーネントファイル: Web サイトは多くの異なるファイルで構成されます。これはお店で複数の部品を買うようなものです。これらのファイルは主に 2種類に当てはまります。
    • コードファイル: Web サイトは主に HTML、CSS、JavaScript から作られます。しかし、ちょっと後で他の技術にも出会うことになるでしょう。
    • アセット: これは画像、音楽、動画、Word 文書、PDF といった Web サイトを構成するコード以外のすべての材料の集合的な名前です。

ならば何が起こるのか

ブラウザに Web アドレスを打ち込んだ時に何が起こっているかというと (お店に歩いていく例えでは),

  1. ブラウザは DNS サーバにアクセスし、Web サイトのあるサーバの実際のアドレスを探します (お店の住所を見つけます)
  2. ブラウザはサーバに HTTP リクエストメッセージを送信して、Web サイトのコピーをクライアントに送るよう求めます (お店に行ってものを注文します)。このメッセージ、およびクライアントとサーバ間でやりとりされるその他すべてのデータは、TCP/IP を使用してインターネット経由で送信されます
  3. サーバがクライアントのリクエストを承認すると、サーバはクライアントに "200 OK" というメッセージを送ります。これは「もちろんその Web サイトを見ることができます。どうぞ!」という意味です。そして Web サイトのファイルを、データパケットと呼ばれる一連の小さな塊 (chunk)としてブラウザに送信し始めます (お店は商品を渡し、あなたは自宅に持って帰ります)
  4. ブラウザは小さな塊を完全な Web サイトに組み立て、表示します (玄関にものが到着しました — 新しいピカピカのものです、すばらしい!)

DNS の説明

実際の Web アドレスは、お気に入りの Web サイトを見つけるためにアドレスバーに入力するような、すばらしい、覚えやすい文字列ではありません。これは 63.245.217.105 のような特殊な数字です。

これは、IP アドレス と呼ばれ、Web 上の一意の場所を表します。しかし、覚えにくいと思いませんか?だから、ドメインネームサーバが発明されたのです。これらは特別なサーバで、ブラウザに入力した Web アドレス ("mozilla.org" など) と Web サイトの実際の (IP) アドレスを対応させます。

Web サイトには、IP アドレスを使用して直接アクセスできます。IP Checker のようなツールにドメインを打ち込むことで Web サイトの IP アドレスを見つけることができます。

パケットの説明

先ほど、データがサーバからクライアントに送信される形式を説明するために、「パケット」という用語を使用しました。ここではどういう意味でしょうか。基本的に、Web 上でデータが送信されると、何千もの小さな塊として送信されるため、たくさんの異なるユーザが同じ Web サイトを同時にダウンロードできます。Web サイトが単一の大きな塊として送信されるとすると、一度に 1人のユーザしかダウンロードできなくなるため、Web がとても非効率的になり、使うのが楽しくなくなるでしょう。

関連情報

クレジット表示

道路の写真: Street composing, by Kevin D.

このモジュール

ドキュメントのタグと貢献者

最終更新者: silverskyvicto,