サーバー/インフラ

【2025年版】Webサーバーの仕組みとは？初心者向けに図解で解説｜Apache・Nginx・種類と選び方

  /
完全初心者でも分かる！Webサーバーの基本的な仕組みと使い方

Webサイトを公開する際に必ず必要になる「Webサーバー」。デザインやコーディングはできても、「Webサーバーの仕組みがよく分からない」という方は多いのではないでしょうか？

この記事では、Web制作初心者の方に向けて、Webサーバーの基本的な仕組みから、主要なWebサーバーソフトウェア（Apache・Nginx）の違い、実際の設定例まで、図解を使ってわかりやすく解説します。

この記事でわかること:

  • Webサーバーとは何か？（定義・役割）
  • Webサーバーの仕組み（リクエスト-レスポンスサイクル）
  • Apache・Nginx・IIS・LiteSpeedの特徴と違い
  • 実際の設定例（httpd.conf、nginx.conf）
  • 初心者がつまずくポイント5つと解決策
  • よくある質問（Q&A）

Webサーバーの仕組みを理解すれば、Webサイト制作やトラブルシューティングがスムーズになります。ぜひ最後までお読みください。

1. Webサーバーとは？

1-1. Webサーバーの定義

Webサーバーとは、インターネット上でWebサイトのデータを保管し、ユーザーからのリクエストに応じてHTMLファイルや画像、CSS、JavaScriptなどのコンテンツを配信するコンピュータ（またはソフトウェア）のことです。

Webサーバーは大きく2つの意味で使われます:

  1. ハードウェアとしてのWebサーバー: Webサイトのファイルを保管する物理的なコンピュータ
  2. ソフトウェアとしてのWebサーバー: HTTP通信を処理するプログラム（Apache、Nginxなど）

一般的にWeb制作の現場で「Webサーバー」と言う場合、ソフトウェアとしてのWebサーバーを指すことが多いです。

1-2. Webサーバーの役割

Webサーバーの主な役割は以下の3つです:

役割 説明 具体例
コンテンツ配信 HTMLファイル、画像、CSS、JavaScriptをクライアント（ブラウザ）に送信 ユーザーがURLにアクセスしたときにWebページを表示
リクエスト処理 ユーザーからのHTTPリクエストを受け取り、適切なレスポンスを返す フォーム送信、API呼び出しの処理
アクセス制御 認証・認可、IPアドレス制限、SSL/TLS暗号化 管理画面へのアクセス制限、HTTPS通信

1-3. なぜWebサーバーが必要なのか？

Webサイトを公開するには、24時間365日稼働し続けるコンピュータ（サーバー）が必要です。自宅のパソコンでもWebサーバーを立ち上げることは可能ですが、以下の理由から専用のWebサーバーを使うのが一般的です:

  • 安定性: 24時間365日稼働、停電対策、バックアップ体制
  • 速度: 高速な回線、CDN連携、キャッシュ最適化
  • セキュリティ: ファイアウォール、DDoS対策、SSL証明書
  • 拡張性: アクセス増加時のスケーリング対応

2. Webサーバーの仕組み

2-1. リクエスト-レスポンスサイクル

Webサーバーはクライアント-サーバーモデルで動作します。ユーザー（クライアント）がブラウザでURLにアクセスすると、以下の流れでWebページが表示されます:

Webサーバーのリクエスト-レスポンスサイクル

1
リクエスト送信
ユーザーがブラウザでURL（例: https://example.com/index.html）にアクセス
2
DNSクエリ
ドメイン名をIPアドレスに変換（example.com → 192.0.2.1）
3
HTTPリクエスト
ブラウザがWebサーバーに「index.htmlを送ってください」とリクエスト
4
ファイル検索
WebサーバーがHTMLファイルを探す
5
HTTPレスポンス
WebサーバーがHTMLファイルをブラウザに送信
6
表示
ブラウザがHTMLを解析してWebページを表示

この一連の流れをリクエスト-レスポンスサイクルと呼びます。

2-2. HTTP/HTTPSプロトコル

Webサーバーとブラウザの通信にはHTTP（HyperText Transfer Protocol）というプロトコルが使われます。

プロトコル 説明 ポート番号 セキュリティ
HTTP 暗号化なしの通信 80 ❌ 低い（盗聴リスク）
HTTPS SSL/TLSで暗号化された通信 443 ✅ 高い（暗号化）

2025年現在、ほとんどのWebサイトはHTTPSを使用しています。GoogleもHTTPSをSEO評価の要素としているため、新規サイトは必ずHTTPSで公開しましょう。

2-3. HTTPリクエストの例

実際のHTTPリクエストは以下のような形式です:

GET /index.html HTTP/1.1
Host: example.com
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64)
Accept: text/html,application/xhtml+xml
Accept-Language: ja,en;q=0.9
  • GET: HTTPメソッド（他にPOST、PUT、DELETEなど）
  • /index.html: リクエストするファイルのパス
  • HTTP/1.1: HTTPバージョン
  • Host: アクセス先のドメイン
  • User-Agent: ブラウザの種類・バージョン

2-4. HTTPレスポンスの例

Webサーバーからのレスポンス:

HTTP/1.1 200 OK
Content-Type: text/html; charset=UTF-8
Content-Length: 1234
Server: Apache/2.4.41

<!DOCTYPE html>
<html lang="ja">
<head>
    <title>サンプルページ</title>
</head>
<body>
    <h1>Hello, World!</h1>
</body>
</html>
  • 200 OK: ステータスコード（成功）
  • Content-Type: コンテンツの種類（HTML）
  • Server: Webサーバーソフトウェアの種類・バージョン

主なHTTPステータスコード:

コード 意味 説明
200 OK リクエスト成功
301 Moved Permanently 恒久的なリダイレクト
404 Not Found ファイルが見つからない
500 Internal Server Error サーバー内部エラー
503 Service Unavailable サーバー過負荷

301リダイレクトの詳しい設定方法はこちらの記事をご覧ください。

3. 主要なWebサーバーソフトウェア

3-1. Apache（アパッチ）

Apache HTTP Serverは世界で最も使われているWebサーバーソフトウェアです（2025年時点）。

開発元 Apache Software Foundation
リリース 1995年
ライセンス オープンソース（Apache License 2.0）
シェア 約30%（2025年）
対応OS Linux、Windows、macOS

Apacheの特徴:

  • ✅ 豊富なモジュール（mod_rewrite、mod_ssl等）
  • ✅ .htaccessでディレクトリ単位の設定が可能
  • ✅ 長い歴史と豊富なドキュメント
  • ❌ 大量の同時接続に弱い（C10K問題）
  • ❌ メモリ消費量が多い

Apacheが向いているケース:

  • 共用レンタルサーバー（.htaccess必須）
  • WordPressサイト（プラグイン互換性が高い）
  • 複雑なURL書き換え処理が必要な場合

3-2. Nginx（エンジンエックス）

Nginxは高速・高負荷に強いWebサーバーとして2000年代後半から急成長しているソフトウェアです。

開発元 Nginx, Inc.（現在はF5 Networks傘下）
リリース 2004年
ライセンス オープンソース（2-clause BSD License）
シェア 約35%（2025年）
対応OS Linux、Windows、macOS

Nginxの特徴:

  • ✅ 大量の同時接続に強い（C10K問題を解決）
  • ✅ 低メモリ消費
  • ✅ 高速な静的ファイル配信
  • ✅ リバースプロキシ・ロードバランサーとしても使える
  • ❌ .htaccessが使えない（設定はnginx.confのみ）
  • ❌ Apacheに比べてモジュールが少ない

Nginxが向いているケース:

  • 大規模Webサービス（アクセス数が多い）
  • 静的ファイル配信（画像、動画、CSS、JS）
  • APIサーバー
  • リバースプロキシ・ロードバランサー

3-3. IIS（Internet Information Services）

IISはMicrosoft製のWebサーバーソフトウェアで、Windows Serverに標準搭載されています。

開発元 Microsoft
リリース 1995年
ライセンス プロプライエタリ（Windows Server付属）
シェア 約7%（2025年）
対応OS Windows Server

IISの特徴:

  • ✅ Windows環境との親和性が高い
  • ✅ ASP.NET、C#との連携がスムーズ
  • ✅ GUIで設定可能（IIS Manager）
  • ❌ Windowsライセンス費用が必要
  • ❌ Linux環境では使えない

IISが向いているケース:

  • ASP.NET、C#で開発されたWebアプリケーション
  • Microsoft製品（SQL Server、Active Directory）との連携
  • Windows Server環境

3-4. LiteSpeed

LiteSpeedは商用の高速Webサーバーで、Apache互換性を保ちながらNginx並みの高速化を実現しています。

開発元 LiteSpeed Technologies
リリース 2003年
ライセンス 商用（無料版もあり）
シェア 約10%（2025年）
対応OS Linux

LiteSpeedの特徴:

  • ✅ Apacheの.htaccessがそのまま使える
  • ✅ Nginx並みの高速化
  • ✅ WordPress高速化プラグイン（LiteSpeed Cache）
  • ❌ 商用ライセンスが必要（個人は無料版あり）

LiteSpeedが向いているケース:

  • WordPressサイト（高速化重視）
  • Apacheからの移行（.htaccess互換）
  • レンタルサーバー事業者

3-5. Apache vs Nginx 比較表

項目 Apache Nginx
シェア（2025年） 約30% 約35%
リリース年 1995年 2004年
同時接続性能 ❌ 弱い（C10K問題） ✅ 強い
メモリ消費 ❌ 多い ✅ 少ない
静的ファイル配信速度 普通 ✅ 高速
.htaccess対応 ✅ 対応 ❌ 非対応
モジュール ✅ 豊富 少ない
設定ファイル httpd.conf、.htaccess nginx.conf（一元管理）
学習コスト 低い（資料が豊富） やや高い
向いている用途 共用レンタルサーバー、WordPress 大規模サービス、静的ファイル配信

選び方の目安:

  • 共用レンタルサーバー、WordPress: Apache（.htaccess必須）
  • VPS・専用サーバー、大規模サービス: Nginx（高速・高負荷対応）
  • WordPressで高速化重視: LiteSpeed
  • Windows環境: IIS

4. Webサーバーとレンタルサーバーの違い

4-1. 概念の整理

「Webサーバー」と「レンタルサーバー」は混同されやすいですが、以下のように区別されます:

用語 意味 例
Webサーバー Webサイトを配信するソフトウェア Apache、Nginx、IIS
レンタルサーバー サーバーマシンを借りるサービス エックスサーバー、ConoHa WING、ロリポップ

レンタルサーバーの中にWebサーバーソフトウェアが動いているというイメージです。

4-2. 実務での使い分け

項目 レンタルサーバー VPS・専用サーバー
Webサーバーソフト 事業者が設定済み（Apache、LiteSpeed等） 自分で選択・設定（Apache、Nginx等）
設定の自由度 ❌ 低い（.htaccessのみ） ✅ 高い（全て自由）
運用難易度 ✅ 簡単（サーバー管理不要） ❌ 難しい（サーバー管理必要）
料金 月500-3,000円 月1,000-20,000円
向いている人 初心者、WordPress運営者 エンジニア、大規模サービス

初めてのWebサイト公開ならレンタルサーバーがおすすめです。Webサーバーの設定を自分で行う必要がなく、すぐにサイトを公開できます。

5. 基本的な設定例

5-1. Apacheの設定（httpd.conf）

Apacheの基本設定ファイルはhttpd.confです。

例1: バーチャルホスト設定

<VirtualHost *:80>
    ServerName example.com
    ServerAlias www.example.com
    DocumentRoot /var/www/html/example

    <Directory /var/www/html/example>
        Options Indexes FollowSymLinks
        AllowOverride All
        Require all granted
    </Directory>

    ErrorLog /var/log/apache2/example-error.log
    CustomLog /var/log/apache2/example-access.log combined
</VirtualHost>

設定項目の説明:

  • ServerName: メインのドメイン名
  • ServerAlias: エイリアス（www付きドメイン等）
  • DocumentRoot: Webサイトのルートディレクトリ
  • AllowOverride All: .htaccessを有効化
  • ErrorLog, CustomLog: ログファイルの保存先

例2: SSL/HTTPS設定

<VirtualHost *:443>
    ServerName example.com
    DocumentRoot /var/www/html/example

    SSLEngine on
    SSLCertificateFile /etc/ssl/certs/example.com.crt
    SSLCertificateKeyFile /etc/ssl/private/example.com.key
    SSLCertificateChainFile /etc/ssl/certs/chain.crt
</VirtualHost>

HTTPS化したら、OGP設定も見直しましょう。詳しくはOGP設定ガイドをご覧ください。

5-2. Nginxの設定（nginx.conf）

Nginxの設定ファイルはnginx.confまたは/etc/nginx/sites-available/配下の個別ファイルです。

例1: 基本的なWebサイト設定

server {
    listen 80;
    server_name example.com www.example.com;
    root /var/www/html/example;
    index index.html index.php;

    location / {
        try_files $uri $uri/ =404;
    }

    location ~ \.php$ {
        fastcgi_pass unix:/var/run/php/php8.1-fpm.sock;
        fastcgi_index index.php;
        include fastcgi_params;
    }

    error_log /var/log/nginx/example-error.log;
    access_log /var/log/nginx/example-access.log;
}

例2: HTTPSリダイレクト + HTTPS設定

# HTTPからHTTPSへリダイレクト
server {
    listen 80;
    server_name example.com;
    return 301 https://$server_name$request_uri;
}

# HTTPS設定
server {
    listen 443 ssl;
    server_name example.com;
    root /var/www/html/example;

    ssl_certificate /etc/ssl/certs/example.com.crt;
    ssl_certificate_key /etc/ssl/private/example.com.key;
    ssl_protocols TLSv1.2 TLSv1.3;

    location / {
        try_files $uri $uri/ =404;
    }
}

例3: リバースプロキシ設定

server {
    listen 80;
    server_name example.com;

    location / {
        proxy_pass http://localhost:3000;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }
}

この設定により、Nginxがフロントエンド、別のアプリケーション（Node.js等）がバックエンドとして動作します。

画像最適化では、SVG形式の活用も効果的です。詳しくはSVG完全ガイドをご覧ください。

6. 初心者がつまずくポイント5つ

ポイント1: ポート番号の設定ミス

問題: Webサーバーを起動しても「接続できません」エラーが出る

原因:

  • ポート80（HTTP）または443（HTTPS）が他のプログラムで使われている
  • ファイアウォールでポートが閉じられている

解決策:

# ポート80が使われているか確認（Linux）
sudo lsof -i :80

# ファイアウォールでポート80を開放（Ubuntu）
sudo ufw allow 80/tcp
sudo ufw allow 443/tcp

ポイント2: パーミッション（権限）設定

問題: 「403 Forbidden」エラーが出る

原因: ファイルやディレクトリの権限が正しく設定されていない

解決策:

# Webサーバーがファイルを読めるように権限変更
sudo chown -R www-data:www-data /var/www/html
sudo chmod -R 755 /var/www/html

# WordPressの場合
sudo chmod 644 wp-config.php

権限の目安:

  • ディレクトリ: 755（rwxr-xr-x）
  • HTMLファイル: 644（rw-r–r–）
  • PHPファイル: 644（rw-r–r–）
  • 設定ファイル（wp-config.php等）: 600（rw——-）

ポイント3: バーチャルホスト設定

問題: 複数のサイトを1つのサーバーで運用したいが、全て同じサイトが表示される

原因: バーチャルホスト設定ができていない

解決策（Apache）:

# /etc/apache2/sites-available/site1.conf
<VirtualHost *:80>
    ServerName site1.com
    DocumentRoot /var/www/site1
</VirtualHost>

# /etc/apache2/sites-available/site2.conf
<VirtualHost *:80>
    ServerName site2.com
    DocumentRoot /var/www/site2
</VirtualHost>
# 有効化
sudo a2ensite site1.conf
sudo a2ensite site2.conf
sudo systemctl reload apache2

ポイント4: SSL証明書の設定

問題: HTTPSでアクセスすると「証明書エラー」が出る

原因: SSL証明書が正しくインストールされていない、または期限切れ

解決策: Let’s Encryptで無料SSL証明書を取得

# Certbot（Let's Encrypt）のインストール
sudo apt install certbot python3-certbot-apache

# SSL証明書の自動取得・設定
sudo certbot --apache -d example.com -d www.example.com

# 自動更新設定
sudo certbot renew --dry-run

ポイント5: .htaccessが効かない

問題: Apacheで.htaccessを設置したのに反映されない

原因: AllowOverride Noneになっている

解決策:

# /etc/apache2/sites-available/000-default.conf
<Directory /var/www/html>
    AllowOverride All  # Noneから変更
</Directory>
# Apache再起動
sudo systemctl restart apache2

7. よくある質問（Q&A）

Q1. WebサーバーとアプリケーションサーバーV違いは？

A1:

  • Webサーバー: 静的ファイル（HTML、CSS、画像）を配信するのが主な役割
  • アプリケーションサーバー: 動的処理（PHP、Java、Python）を実行するのが主な役割

実務では両方を組み合わせて使います。例えば、Nginx（Webサーバー）がフロントエンドで静的ファイルを配信し、PHP-FPM（アプリケーションサーバー）がPHPの処理を行う、という構成が一般的です。

Q2. 個人ブログに最適なWebサーバーは？

A2: レンタルサーバー（Apache または LiteSpeed搭載）がおすすめです。

理由:

  • サーバー管理不要（初心者でも使いやすい）
  • WordPress等のCMSがワンクリックでインストール可能
  • .htaccessが使える（URL書き換え、リダイレクト設定が簡単）
  • 月500-1,500円程度で十分

おすすめレンタルサーバー:

  • エックスサーバー: 国内シェアNo.1、高速・安定
  • ConoHa WING: 初期費用無料、高速化機能充実
  • ロリポップ: 月500円〜、初心者向け

Q3. Apache と Nginx、どちらを選ぶべき？

A3: 用途によって選びましょう。

選ぶべきWebサーバー 用途
Apache ・共用レンタルサーバー
・WordPress（.htaccess必須）
・学習用（ドキュメント豊富）
Nginx ・VPS・専用サーバー
・大規模サービス（アクセス数多い）
・静的ファイル配信（画像、動画）

両方使う構成もあります: Nginx（リバースプロキシ）→ Apache（バックエンド）

Q4. Webサーバーのセキュリティはどうすればいい？

A4: 以下の基本対策を実施しましょう:

  1. HTTPS化: Let’s Encryptで無料SSL証明書を導入
  2. Webサーバーソフトウェアの更新: 脆弱性対策のため最新版を維持
  3. ファイアウォール設定: 不要なポートを閉じる
  4. アクセス制限: 管理画面へのIP制限、Basic認証
  5. ログ監視: エラーログ・アクセスログを定期的に確認

Apache の場合:

# 管理画面へのIP制限
<Directory /var/www/html/admin>
    Require ip 192.168.1.100
</Directory>

Nginx の場合:

location /admin {
    allow 192.168.1.100;
    deny all;
}

Q5. Webサーバーが突然止まった時の対処法は?

A5: 以下の手順で確認・復旧します:

1. Webサーバーの状態確認

# Apache の場合
sudo systemctl status apache2

# Nginx の場合
sudo systemctl status nginx

2. エラーログ確認

# Apache
sudo tail -f /var/log/apache2/error.log

# Nginx
sudo tail -f /var/log/nginx/error.log

3. Webサーバー再起動

# Apache
sudo systemctl restart apache2

# Nginx
sudo systemctl restart nginx

4. 設定ファイルの文法チェック

# Apache
sudo apache2ctl configtest

# Nginx
sudo nginx -t

よくある原因:

  • 設定ファイルの文法エラー
  • ディスク容量不足
  • メモリ不足
  • ポート競合

8. まとめ

この記事では、Webサーバーの基本的な仕組みから、主要なWebサーバーソフトウェア（Apache・Nginx・IIS・LiteSpeed）の違い、実際の設定例まで解説しました。

重要ポイントのおさらい

  1. Webサーバーとは: Webサイトのデータを保管し、ユーザーのリクエストに応じてコンテンツを配信するソフトウェア
  2. リクエスト-レスポンスサイクル: ブラウザ→HTTPリクエスト→Webサーバー→HTTPレスポンス→ブラウザ表示
  3. Apache vs Nginx:
    • Apache: .htaccess対応、初心者向け、共用サーバー
    • Nginx: 高速・高負荷対応、VPS向け
  4. 初心者はレンタルサーバーから始めるのがおすすめ: サーバー管理不要、WordPress簡単インストール

次のステップ

Webサーバーの基礎を理解したら、次は以下にチャレンジしてみましょう:

  • VPSでWebサーバー構築: さくらのVPS、ConoHa VPSでApache/Nginxをインストール
  • WordPress高速化: キャッシュプラグイン、画像最適化、CDN導入
  • HTTPS化: Let’s Encryptでサイトを暗号化
  • Docker環境構築: コンテナでWebサーバーを管理

Webサーバーの仕組みを理解すれば、Webサイト運営やトラブルシューティングがスムーズになります。ぜひ実際に手を動かして学んでみてください！

RELATED POST