🏓

【AWS】CloudFrontディストリビューションの作成・テスト方法

2024/09/11に公開

ACM(AWS Certificate Manager)での証明書設定

ACM証明書の作成

  1. AWSマネジメントコンソールにログインし、リージョンを「バージニア北部(us-east-1)」に切り替えます。
  2. 「Certificate Manager」サービスに移動します。
  3. 「証明書をリクエスト」ボタンをクリックします。
  4. 「パブリック証明書をリクエスト」を選択し、「次へ」をクリックします。
  5. 以下の情報を入力します:
    • 完全修飾ドメイン名: app.example.com
    • 追加の名前を追加: *.app.example.com
  6. 「DNS検証」を選択し、「リクエスト」をクリックします。

DNS検証の完了

  1. 証明書の詳細ページに表示されるCNAMEレコードをコピーします。
  2. DNSプロバイダー(例:CloudFlare)のダッシュボードに移動します。
  3. コピーしたCNAMEレコードを追加します:
    • 名前: _acme-challenge.app.example.com
    • タイプ: CNAME
    • 値: [ACMが提供した値]
  4. ACMコンソールに戻り、検証のステータスが「成功」になるまで待ちます(数分から数時間かかる場合があります)。

CloudFrontディストリビューションの作成

Terraformコードの作成

以下のTerraformコードを使用してCloudFrontディストリビューションを作成します:

provider "aws" {
  region = "us-east-1"
}

data "aws_acm_certificate" "app_cert" {
  domain   = "app.example.com"
  statuses = ["ISSUED"]
}

resource "aws_cloudfront_distribution" "app_distribution" {
  enabled             = true
  is_ipv6_enabled     = true
  default_root_object = "index.html"

  aliases = ["app.example.com"]

  origin {
    domain_name = "origin.example.com"
    origin_id   = "app-origin"
    custom_origin_config {
      http_port              = 80
      https_port             = 443
      origin_protocol_policy = "https-only"
      origin_ssl_protocols   = ["TLSv1.2"]
    }
  }

  default_cache_behavior {
    allowed_methods  = ["GET", "HEAD", "OPTIONS"]
    cached_methods   = ["GET", "HEAD"]
    target_origin_id = "app-origin"
    forwarded_values {
      query_string = false
      cookies {
        forward = "none"
      }
    }
    viewer_protocol_policy = "redirect-to-https"
    min_ttl                = 0
    default_ttl            = 3600
    max_ttl                = 86400
  }

  restrictions {
    geo_restriction {
      restriction_type = "none"
    }
  }

  viewer_certificate {
    acm_certificate_arn      = data.aws_acm_certificate.app_cert.arn
    ssl_support_method       = "sni-only"
    minimum_protocol_version = "TLSv1.2_2021"
  }
}

output "cloudfront_domain_name" {
  value = aws_cloudfront_distribution.app_distribution.domain_name
}

Terraformの実行

  1. Terraformコードを保存したディレクトリに移動します。
  2. 以下のコマンドを順に実行します:
    terraform init
    terraform plan
    terraform apply
    
  3. 確認メッセージが表示されたら「yes」と入力します。

CloudFrontのテスト方法

ドメイン名の設定

  1. CloudFlareのダッシュボードに移動します。
  2. DNSセクションで新しいレコードを追加します:
    • タイプ: CNAME
    • 名前: app
    • ターゲット: [CloudFrontのドメイン名]
    • プロキシステータス: オン(オレンジの雲アイコン)

基本的な動作確認

  1. ブラウザで https://app.example.com にアクセスします。
  2. ページが正常に表示されることを確認します。
  3. ブラウザの開発者ツールを開き、ネットワークタブでリクエストを確認します:
    • リクエストがCloudFrontを経由していることを確認(Response Headersに「X-Cache」などのCloudFront特有のヘッダーがあることを確認)
    • SSL/TLS証明書が正しく適用されていることを確認

キャッシュの動作確認

  1. オリジンサーバーで特定のファイル(例:/test.html)を作成または更新します。
  2. https://app.example.com/test.html にアクセスし、コンテンツを確認します。
  3. オリジンサーバーでファイルを再度更新します。
  4. すぐに再度アクセスし、古いコンテンツがキャッシュされていることを確認します。
  5. キャッシュのTTL(デフォルトでは1時間)が経過した後、再度アクセスして新しいコンテンツが表示されることを確認します。

地理的制限のテスト(設定している場合)

  1. VPNを使用して、許可されている国と制限されている国からアクセスを試みます。
  2. 適切にアクセスが制御されていることを確認します。

エラーページのテスト

  1. 存在しないページ(例:https://app.example.com/nonexistent.html)にアクセスします。
  2. 適切なエラーページが表示されることを確認します。

パフォーマンステスト

  1. Google PageSpeed Insights(https://pagespeed.web.dev/)を使用してページの読み込み速度を測定します。
  2. 異なる地理的位置からのレイテンシーをテストするために、https://www.webpagetest.org/を使用します。

これらのテストを実行することで、CloudFrontディストリビューションが正しく設定され、期待通りに機能していることを確認できます。問題が発見された場合は、設定を見直し、必要に応じて調整を行ってください。

GitHubで編集を提案

Discussion