Webサーバーの仕組みをやさしく紹介|ページが届くまでの流れをわかりやすく解説|UNIX Cafe

当ページのリンクには広告が含まれています。
第47回|UNIX Café「Web サーバーってどう動くの?ページが届くしくみ」

UNIX Cafe | 第47回

ミナちゃん

先生、Google やブログのページって、どうやって私のパソコンに届くんですか?

ユニ先生

今日はその“舞台裏”をのぞいてみよう。
ページが表示されるまで、実は小さなステップがいっぱいあるんだ。

目次

URLを入力 → 最初のスタート

ユニ先生

たとえば https://pc-fan.net を入力したとするね。
その瞬間、あなたのパソコンは『このサイトの住所(IP アドレス)教えて!』って問い合わせを始めるんだ。

ミナちゃん

住所…まさか DNS のことですか?

ユニ先生

そのとおり!DNS がページへの最初の案内人なんだ。

DNS が “Web サーバーの住所” を教えてくれる

DNS の役割

  • URL → IP アドレスを調べる
  • “サーバーの場所” を教える案内係
ミナちゃん

このステップが終わらないと、ページにたどり着けないんですね。

あなたのPC → Webサーバーにリクエストを送る

HTTPリクエストって何?

ユニ先生

IP アドレスが分かったら、次に『このページをください!』という HTTPリクエスト を送るんだ。

例:

  • GET /index.html
  • Host: pc-fan.net
ミナちゃん

サーバに手紙を送るみたいですね!

Webサーバーが“ページの材料”を探し始める

Webサーバーの中で起きていること

ユニ先生

Web サーバーは、受け取ったリクエストを見て、
“どのページを返せばいいか” を判断するんだ。

  • index.html などのファイルを取り出す
  • PHP があれば処理して結果を生成
  • WordPressならテンプレートを組み合わせてページを作る
ミナちゃん

WordPress はこのステップで動くんですね!

Webサーバー → あなたのPCへページを送る

HTTPレスポンスの中身

  • ステータスコード(200 / 404 / 500 …)
  • HTMLの本体
  • CSSやJavaScriptのリンク
  • 追加で読み込む画像ファイルの情報
ミナちゃん

ページって、ただのファイルじゃなくて、いろんな部品の集合なんですね。

ステータスコードの数字には “規則” があります

シェリ

Webサーバーが返す数字(ステータスコード)はね、100番台から500番台まで、グループごとにちゃんと意味が決まっているの。
実は“いちばん最初の数字”を見るだけで、大まかな状態がパッと分かっちゃうのよ✨

1xx:情報(Informational)

ユニ先生

「まだ処理中だよ、続きがあるよ」という合図だよ。

  • 100 Continue
  • ブラウザに「そのまま続けてOK」と知らせる

普段あまり目にしません。

2xx:成功(Success)

ミナちゃん

これは「うまくいったよ!」という成功の返事ですね!

  • 200 OK → リクエスト成功、ページを返せる状態
  • 204 No Content → 成功したけど返す内容はないとき

200=“正常にページが届いた” の意味です。

3xx:リダイレクト(Redirection)

ユニ先生

「このページ、別の場所に移動しているよ」という案内だね。

  • 301 Moved Permanently(恒久的に移動)
  • 302 Found(一時的に移動)
  • 307 Temporary Redirect

SEO でもよく出てくる番号ですね。

4xx:クライアント側のエラー(Client Error)

シェリ

「あなた(クライアント)側のリクエストに問題があります!」

  • 404 Not Found → ファイル・ページが見つからない
  • 403 Forbidden → アクセス禁止
  • 400 Bad Request → リクエストが不正

404 は「ページがない」 ときの定番エラーです。

5xx:サーバー側のエラー(Server Error)

シェリ

Oh!「サーバー側で何か問題が起きています!」

  • 500 Internal Server Error → サーバー内部のトラブル
  • 503 Service Unavailable → サーバーが過負荷 or メンテナンス中
  • 504 Gateway Timeout → バックエンドの応答が遅い

ブログ運営で一度は見る番号ですね…。

番号グループの意味
1xx情報100 Continue
2xx成功200 OK
3xxリダイレクト301 / 302
4xxクライアント側のエラー404 Not Found
5xxサーバー側のエラー500 Internal Server Error
ミナちゃん

番号の最初の数字だけで “どんな状態か” がわかるんですね!

ユニ先生

うん。Webの世界では、この番号が“サーバーからの短いメッセージ”なんだよ。

ブラウザがページを組み立てる

表示までの流れ

STEP
HTMLを読みながら構造を作る
STEP
CSSでデザインを重ねる
STEP
JavaScriptで動きを追加
STEP
画像やフォントを読み込む
ユニ先生

まるで料理を盛りつけるように、ブラウザが表示を完成させるんだ。

ブラウザ表示の裏側で動く“たくさんのリクエスト”

ミナちゃん

1ページ開くだけで、こんなにたくさんやり取りしているんですね…!

ユニ先生

うん。実は1ページで 50~150回くらいリクエストすることもあるんだよ。

まとめ

  • URL入力
  • DNSで住所を調べる
  • サーバーへHTTPリクエスト
  • Webサーバーがページを準備
  • PCへレスポンス送信
  • ブラウザがページを組み立てて表示
ミナちゃん

ひとつのページに、こんなに物語があるなんて…!

ユニ先生

Web の世界は“旅”みたいなものだからね。

次回予告

ユニ先生

次は「Apache・Nginxの違いをやさしく比較」
同じ“Webサーバー”でも、Apache と Nginx では動き方に少しちがいがあるんだ。次回は、その特徴をやさしく並べて、違いをいっしょに見ていこうね

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!
目次