AWS S3を活用した静的サイトホスティングは、コスト効率に優れたWebサイト公開手法として広く活用されています。本記事では、AWS S3バケットの作成から静的サイトホスティングの設定、独自ドメインとHTTPSの導入まで、実践的な手順を網羅的に解説します。AWS初心者でも理解できるよう、画像付きで丁寧に説明しますので、ぜひ最後までお読みください。結論：AWS S3を活用した静的サイトホスティングがコストパフォーマンスに優れておりおすすめです。約35分で読めます。

目次

AWS S3とは？静的サイトホスティングの基礎知識
AWSアカウント作成とIAMユーザー設定
S3バケットの作成手順
静的サイトホスティングの有効化
カスタムドメインとHTTPSの設定
セキュリティ設定とベストプラクティス
トラブルシューティングとFAQ
まとめ

AWS S3とは？静的サイトホスティングの基礎知識

Amazon Simple Storage Service（S3）は、AWSが提供するオブジェクトストレージサービスです。静的サイトホスティング機能を活用することで、HTML、CSS、JavaScriptファイルなどの静的コンテンツを簡単に公開できます。従来のWebサーバーと比較して、以下のようなメリットがあります。

  • コスト効率：月額数百円から運用可能（2024年6月現在、東京リージョンで1GBあたり0.023USD）
  • スケーラビリティ：アクセス数に応じて自動的にスケール
  • 可用性：SLA 99.99%の高い可用性を保証
  • セキュリティ：暗号化、アクセス制御、監査機能を標準装備

静的サイトホスティングとは、サーバーサイドの処理を必要としないWebサイト（HTML/CSS/JSファイル）をインターネット上に公開する仕組みです。代表的な利用例として、ポートフォリオサイト、ブログ、ドキュメントサイト、ランディングページなどがあります。

AWS公式によると、2023年の時点でS3を利用した静的サイトホスティングは全世界で100万件以上のサイトで採用されています（出典: AWS公式ブログ）。

静的サイトホスティングの仕組み

S3で静的サイトホスティングを実現する仕組みは以下の通りです。

  1. HTMLファイルをS3バケットにアップロード
  2. バケットを静的サイトホスティング用に設定
  3. S3が提供するエンドポイント（例：http://bucket-name.s3-website-ap-northeast-1.amazonaws.com）にアクセス
  4. ブラウザが静的ファイルを直接ダウンロードして表示

この仕組みにより、サーバーを常時稼働させる必要がなく、コストを大幅に削減できます。

AWSアカウント作成とIAMユーザー設定

AWS S3を利用するには、まずAWSアカウントを作成し、適切な権限を持つIAMユーザーを設定する必要があります。以下の手順で進めてください。

AWSアカウントの作成

AWSアカウントをまだお持ちでない場合は、以下の手順で作成します。

  1. AWS公式サイトにアクセス
  2. 「AWSアカウントを作成する」をクリック
  3. メールアドレス、パスワード、AWSアカウント名を入力
  4. 連絡先情報（住所、電話番号）を入力
  5. クレジットカード情報を登録（AWSは無料利用枠があります）
  6. 電話番号の確認（SMSまたは音声通話）
  7. サポートプランの選択（無料プランでOK）

注意事項：AWSアカウント作成時は、必ず「IAMユーザーを作成する」を選択し、ルートアカウント（管理者権限）を直接使用しないようにしてください。セキュリティ上のリスクがあります。

IAMユーザーの作成と権限設定

AWSのベストプラクティスに従い、ルートアカウントではなくIAMユーザーを使用します。以下の手順でIAMユーザーを作成し、S3バケット操作に必要な権限を付与します。

  1. AWSマネジメントコンソールにログイン
  2. 「IAM」サービスを検索して選択
  3. 左側メニューの「ユーザー」をクリック
  4. 「ユーザーを追加」ボタンをクリック
  5. ユーザー名を入力（例：static-site-admin）
  6. 「プログラムによるアクセス」と「AWSマネジメントコンソールへのアクセス」を選択
  7. 「次へ：権限」をクリック
  8. 「既存のポリシーを直接アタッチ」を選択
  9. 以下のポリシーを検索して選択：
    • AmazonS3FullAccess（S3バケットの完全な制御権限）
    • IAMReadOnlyAccess（IAMユーザーの閲覧権限）
  10. 「次へ：タグ」で任意のタグを追加（省略可）
  11. 「次へ：確認」をクリック
  12. 「ユーザーの作成」をクリック
  13. アクセスキーIDとシークレットアクセスキーをダウンロード（必ず安全な場所に保存）

セキュリティに関する重要な注意：

  • アクセスキーとシークレットキーは絶対に他人に教えない
  • 定期的にローテーションする（3ヶ月に1回程度）
  • MFA（多要素認証）を有効にすることを推奨

IAMユーザーの作成が完了したら、AWSマネジメントコンソールからログアウトし、新しく作成したIAMユーザーで再度ログインします。

S3バケットの作成手順

IAMユーザーの準備が整ったら、次はS3バケットを作成します。バケット名は全世界で一意である必要がありますので、注意してください。

S3バケットの作成

  1. AWSマネジメントコンソールにログイン（IAMユーザーで）
  2. 「S3」サービスを検索して選択
  3. 「バケットを作成」ボタンをクリック
  4. 以下の設定を行います：
    • バケット名：一意の名前を入力（例：my-static-site-2024）
    • リージョン：使用するリージョンを選択（例：アジアパシフィック（東京）[ap-northeast-1]）
    • オブジェクト所有者：「オブジェクト writer」を選択
    • パブリックアクセスをすべてブロック：無効にします（静的サイトホスティングに必要）
    • バケットバージョニング：「無効」のまま（必要に応じて有効化）
    • 暗号化：「Amazon S3管理キー（SSE-S3）」を選択
  5. 「バケットを作成」をクリック

バケット名に関する注意事項：

  • 全世界で一意である必要があります
  • DNS互換の名前を使用（英数字とハイフンのみ）
  • 3文字以上63文字以下
  • IPアドレス形式は使用不可
  • 先頭と末尾は英数字にする

バケットポリシーの設定

静的サイトホスティングを有効にするには、バケットポリシーを設定してパブリックアクセスを許可する必要があります。

  1. 作成したバケットを選択
  2. 「権限」タブをクリック
  3. 「バケットポリシー」セクションで「編集」をクリック
  4. 以下のポリシードキュメントを入力（YOUR_BUCKET_NAMEを実際のバケット名に置換）：
<Policy>
  {
    "Version": "2012-10-17",
    "Statement": [
      {
        "Sid": "PublicReadGetObject",
        "Effect": "Allow",
        "Principal": "*",
        "Action": "s3:GetObject",
        "Resource": "arn:aws:s3:::YOUR_BUCKET_NAME/*"
      }
    ]
  }
</Policy>
  1. 「変更を保存」をクリック

注意：このポリシーにより、インターネット上の誰でもバケット内のオブジェクトを読み取ることができます。機密情報を含むファイルはアップロードしないでください。

静的サイトホスティングの有効化

S3バケットの作成が完了したら、次は静的サイトホスティングを有効化します。これにより、S3がWebサーバーとして機能するようになります。

静的サイトホスティングの設定

  1. バケットを選択
  2. 「プロパティ」タブをクリック
  3. 「静的ウェブサイトホスティング」セクションで「編集」をクリック
  4. 以下の設定を行います：
    • 静的ウェブサイトホスティング：有効にする
    • インデックスドキュメント：index.html（デフォルトのホームページ）
    • エラードキュメント：error.html（404エラー時のページ）
  5. 「変更を保存」をクリック

注意：インデックスドキュメントとエラードキュメントには、必ずバケット内にファイルが存在する必要があります。ファイルをアップロードしていない場合は、先にアップロードしてください。

ファイルのアップロードと公開

静的サイトホスティングを機能させるには、HTMLファイルなどのコンテンツをバケットにアップロードする必要があります。以下の手順でファイルをアップロードします。

  1. バケットを選択
  2. 「オブジェクト」タブをクリック
  3. 「アップロード」ボタンをクリック
  4. 「ファイルを追加」をクリックして、ローカルのHTMLファイルを選択
  5. 「アップロード」をクリック
  6. アップロード完了後、ファイルを選択して「アクション」→「パブリックアクセスを許可」をクリック

推奨ファイル構成：

  • index.html – ホームページ
  • about.html – Aboutページ
  • contact.html – Contactページ
  • styles.css – スタイルシート
  • script.js – JavaScriptファイル
  • images/ – 画像ファイル用ディレクトリ

サイトの公開確認

ファイルのアップロードが完了したら、S3が提供するエンドポイントを使用してサイトを公開します。

  1. バケットを選択
  2. 「プロパティ」タブをクリック
  3. 「静的ウェブサイトホスティング」セクションで「バケットウェブサイトエンドポイント」をコピー
  4. コピーしたURLをブラウザに貼り付けてアクセス

正しく設定されていれば、アップロードしたHTMLファイルが表示されるはずです。例えば、http://my-static-site-2024.s3-website-ap-northeast-1.amazonaws.com のようなURLになります。

注意：S3の静的サイトホスティングエンドポイントはHTTPSに対応していません。HTTPSを利用するには、CloudFrontとACMを組み合わせる必要があります（後述のセクションで解説）。

カスタムドメインとHTTPSの設定

S3のデフォルトエンドポイント（s3-website-*.amazonaws.com）ではなく、独自ドメイン（例：example.com）でサイトを公開するには、Route 53とCloudFrontを使用します。また、HTTPSを有効にすることでセキュリティを向上させることができます。

Route 53でのドメイ…

独自ドメインを取得していない場合は、以下の手順で取得します。

  1. Route 53にアクセス
  2. 「ドメインを登録」をクリック
  3. 希望するドメイン名を検索
  4. 登録手続きを完了（料金は年間12USD〜）

ドメインを取得したら、Route 53でホストゾーンを作成します。

  1. Route 53コンソールに移動
  2. 「ホストゾーン」をクリック
  3. 「ホストゾーンを作成」をクリック
  4. ドメイン名を入力して「ホストゾーンを作成」
  5. NSレコード（ネームサーバー）をコピー

ドメインレジストラ（お名前.com、GoDaddyなど）で、NSレコードをRoute 53のものに変更します。変更には最大48時間かかる場合があります。

CloudFrontディス…

CloudFrontを使用することで、S3バケットをオリジンとするCDN（コンテンツデリバリーネットワーク）を構築できます。また、HTTPSを有効にすることもできます。

  1. AWSマネジメントコンソールで「CloudFront」を検索して選択
  2. 「ディストリビューションを作成」をクリック
  3. 以下の設定を行います：
    • オリジン設定：
      • オリジンID：任意のID（例：S3-my-static-site）
      • オリジンドメイン：S3バケットの静的サイトホスティングエンドポイント（例：my-static-site-2024.s3-website-ap-northeast-1.amazonaws.com）
      • 名前：オリジンIDと同じ
      • S3バケットアクセス：はい、OAIを使用するを選択
      • メソッド：GET、HEADを選択
    • デフォルトキャッシュ動作設定：
      • ビューアーのプロトコルポリシー：HTTPとHTTPSを選択
      • 許可されたHTTPメソッド：GET、HEADを選択
      • キャッシュポリシー：CachingOptimizedを選択
    • 設定：
      • カスタムSSL証明書：ACMからのSSL証明書をリクエストを選択
      • カスタムSSL証明書のリージョン：us-east-1（CloudFrontでSSL証明書を使用するには、必ずus-east-1リージョンで発行する必要があります）
      • デフォルトのルートオブジェクト：index.html
  4. 「ディストリビューションを作成」をクリック

ACM（AWS Certificate Manager）でのSSL証明書発行：

  1. AWSマネジメントコンソールで「ACM」を検索して選択
  2. 「証明書をリクエスト」をクリック
  3. 「パブリック証明書をリクエスト」を選択
  4. ドメイン名を入力（例：example.com、*.example.com）
  5. DNS検証を選択
  6. 「リクエスト」をクリック
  7. Route 53でホストゾーンを選択し、CNAMEレコードを作成して検証を完了

注意：SSL証明書の発行には数分〜数時間かかる場合があります。また、CloudFrontディストリビューションのデプロイ完了にも30分〜1時間程度かかります。

Route 53でのエイリ…

CloudFrontディストリビューションのデプロイが完了したら、Route 53でエイリアスレコードを作成します。

  1. Route 53コンソールに移動
  2. ホストゾーンを選択
  3. 「レコードを作成」をクリック
  4. 以下の設定を行います：
    • レコード名：www（サブドメイン）または空白（ルートドメイン）
    • レコードタイプ：A - IPv4アドレスを選択
    • エイリアス：オンを選択
    • エイリアスターゲット：CloudFrontディストリビューションを選択
  5. 「レコードを作成」をクリック

設定が反映されるまで最大48時間かかりますが、通常は数分〜数時間で反映されます。反映後、ブラウザで独自ドメイン（例：https://www.example.com）にアクセスして、サイトが正しく表示されることを確認します。

セキュリティ設定とベストプラクティス

AWS S3を使用した静的サイトホスティングでは、セキュリティ設定が非常に重要です。以下のベストプラクティスに従って、安全な運用環境を構築しましょう。

S3バケットのセキュリティ設定

ブロックパブリックアクセス設定の確認

静的サイトホスティングを有効にする際に、パブリックアクセスを許可しましたが、その他の設定も確認しておきましょう。

  1. バケットを選択
  2. 「権限」タブをクリック
  3. 「ブロックパブリックアクセス」セクションで「編集」をクリック
  4. 以下の設定が「オン」になっていることを確認：
    • 「すべてのパブリックアクセスをブロック」
    • 「バケットポリシーでパブリックアクセスを許可する」
  5. 「変更を保存」をクリック

注意：静的サイトホスティングを機能させるためには、バケットポリシーでパブリックアクセスを許可する必要があります。これは例外的な設定ですので、機密情報を含むファイルはアップロードしないでください。

暗号化の有効化

S3バケット内のデータは、デフォルトで暗号化されていますが、さらに強化することができます。

  1. バケットを選択
  2. 「プロパティ」タブをクリック
  3. 「デフォルト暗号化」セクションで「編集」をクリック
  4. 以下の設定を行います：
    • 暗号化タイプ：AES-256（SSE-S3）またはaws:kms（SSE-KMS）を選択
    • KMSキー：新しいキーを作成するか、既存のキーを選択
  5. 「変更を保存」をクリック

注意：SSE-KMSを使用する場合は、追加の料金が発生します。

CloudFrontのセキ…

WAF（Web Application Firewall）の設定

CloudFrontにWAFを適用することで、SQLインジェクションやクロスサイトスクリプティング（XSS）などの攻撃からサイトを保護できます。

  1. AWSマネジメントコンソールで「WAF & Shield」を検索して選択
  2. 「Web ACLを作成する」をクリック
  3. 以下の設定を行います：
    • 名前：任意の名前（例：StaticSiteProtection）
    • リージョン：グローバル（CloudFront用）を選択
    • ルール：
      • AWSManagedRulesCommonRuleSet（一般的な攻撃から保護）
      • AWSManagedRulesSQLiRuleSet（SQLインジェクションから保護）
  4. 「Web ACLを作成」をクリック
  5. CloudFrontディストリビューションを編集し、作成したWeb ACLを関連付け

キャッシュ設定の最適化

CloudFrontのキャッシュ設定を最適化することで、パフォーマンスを向上させると同時に、セキュリティリスクを軽減できます。

  1. CloudFrontディストリビューションを選択
  2. 「ディストリビューション設定を編集」をクリック
  3. 「キャッシュ」タブで以下の設定を行います：
    • キャッシュポリシー：CachingOptimizedを選択
    • オリジンリクエストポリシー：CORS-With-Preflightを選択（CORSを使用する場合）
    • 制限付きビューアーアクセス：いいえを選択（静的サイトの場合は不要）
  4. 「変更を保存」をクリック

モニタリングとログ記録

AWS CloudTrailの有効化

AWS CloudTrailを使用して、S3バケットやCloudFrontへのアクセスログを記録します。

  1. AWSマネジメントコンソールで「CloudTrail」を検索して選択
  2. 「トレイルを作成する」をクリック
  3. 以下の設定を行います：
    • 名前：任意の名前（例：StaticSiteTrail）
    • リージョン：すべてのリージョンを選択
    • ストレージの場所：新しいS3バケットを作成
    • ログファイルの SSE-KMS 暗号化：有効にする
  4. 「トレイルを作成」をクリック

S3アクセスログの有効化

S3バケットへのアクセスログを記録することで、不正アクセスの検知に役立ちます。

  1. ログを記録するバケットを選択
  2. 「プロパティ」タブをクリック
  3. 「サーバーアクセスのログ記録」セクションで「編集」をクリック
  4. 以下の設定を行います：
    • サーバーアクセスのログ記録を有効にする：オンにする
    • ターゲットバケット：新しいバケットを作成（例：my-static-site-logs）
    • ターゲットプレフィックス：s3-access-logs/（任意）
  5. 「変更を保存」をク tendit>

トラブルシューティングとFAQ

AWS S3を使用した静的サイトホスティングの設定中に発生する可能性のある問題とその解決策について解説します。また、よくある質問と回答をまとめました。

トラブルシューティング

403 Forbiddenエラーが発生する

原因：

  • バケットポリシーが正しく設定されていない
  • パブリックアクセスがブロックされている
  • オブジェクトの所有者が正しく設定されていない

解決策：

  1. バケットポリシーが以下のようになっていることを確認：
    <Policy>
  {
    "Version": "2012-10-17",
    "Statement": [
      {
        "Sid": "PublicReadGetObject",
        "Effect": "Allow",
        "Principal": "*",
        "Action": "s3:GetObject",
        "Resource": "arn:aws:s3:::YOUR_BUCKET_NAME/*"
      }
    ]
  }
</Policy>
  2. 「ブロックパブリックアクセス」設定で「すべてのパブリックアクセスをブロック」がオフになっていることを確認
  3. オブジェクトの所有者がバケット所有者になっていることを確認：
    1. ファイルを選択して「アクション」→「オブジェクトの所有者を変更」をクリック
    2. 「バケット所有者」を選択

404 Not Foundエラーが発生する

原因：

  • インデックスドキュメント（index.html）が存在しない
  • 静的サイトホスティングが有効になっていない
  • CloudFrontのキャ
    ABOUT ME
    たから
    サラリーマンをしながら開業して経営やってます。 今年、本業で独立・別事業を起業予定です。 ◆経験：IT講師/インフラエンジニア/PM/マネジメント/採用/運用・保守・構築・設計 ◆取得資格：CCNA/CCNP/LPIC-1/AZ-900/FE/サーティファイC言語 ◆サイドビジネス：アパレル事業/複数のWEBメディアを運営