TerraformでCloudFrontとS3の静的サイトをコード管理する方法｜OAC・HTTPSリダイレクト・キャッシュポリシーの実践設計

この記事のポイント

・OAI（旧）ではなくOAC（Origin Access Control）でS3を保護するのが現在の推奨設計
・S3バケットはパブリックアクセスを全ブロックし、OACからのGetObjectのみをバケットポリシーで許可する
・CloudFrontのviewer_protocol_policy = "redirect-to-https"でHTTPSへの強制リダイレクトを設定できる
・ACM証明書はCloudFrontのグローバル要件によりus-east-1リージョンで作成する必要がある

# s3.tf
resource "aws_s3_bucket" "static_site" {
  bucket = "${var.project}-${var.environment}-static-site"

  tags = {
    Name        = "${var.project}-static-site"
    Environment = var.environment
  }
}

resource "aws_s3_bucket_public_access_block" "static_site" {
  bucket = aws_s3_bucket.static_site.id

  block_public_acls       = true
  block_public_policy     = true
  ignore_public_acls      = true
  restrict_public_buckets = true
}

# cloudfront_oac.tf（cloudfront.tfと同じファイルでも可）
resource "aws_cloudfront_origin_access_control" "static_site" {
  name                              = "${var.project}-${var.environment}-oac"
  description                       = "OAC for ${var.project} static site S3 origin"
  origin_access_control_origin_type = "s3"
  signing_behavior                  = "always"
  signing_protocol                  = "sigv4"
}

# バケットポリシー：CloudFrontのサービスプリンシパルからのGetObjectのみ許可
resource "aws_s3_bucket_policy" "static_site" {
  bucket = aws_s3_bucket.static_site.id
  policy = data.aws_iam_policy_document.static_site_policy.json

  # パブリックアクセスブロックを先に適用してからポリシーを設定する
  depends_on = [aws_s3_bucket_public_access_block.static_site]
}

data "aws_iam_policy_document" "static_site_policy" {
  statement {
    actions   = ["s3:GetObject"]
    resources = ["${aws_s3_bucket.static_site.arn}/*"]

    principals {
      type        = "Service"
      identifiers = ["cloudfront.amazonaws.com"]
    }

    condition {
      test     = "StringEquals"
      variable = "AWS:SourceArn"
      values   = [aws_cloudfront_distribution.static_site.arn]
    }
  }
}

# cloudfront.tf
resource "aws_cloudfront_distribution" "static_site" {
  enabled             = true
  default_root_object = "index.html"
  aliases             = [var.domain_name]   # 例: "www.example.com"
  price_class         = "PriceClass_200"    # 北米・欧州・アジア（東南アジア含む）

  origin {
    domain_name              = aws_s3_bucket.static_site.bucket_regional_domain_name
    origin_id                = "S3-${aws_s3_bucket.static_site.id}"
    origin_access_control_id = aws_cloudfront_origin_access_control.static_site.id
  }

  default_cache_behavior {
    target_origin_id       = "S3-${aws_s3_bucket.static_site.id}"
    viewer_protocol_policy = "redirect-to-https"  # HTTPをHTTPSへ強制リダイレクト
    allowed_methods        = ["GET", "HEAD"]
    cached_methods         = ["GET", "HEAD"]

    # AWSマネージドキャッシュポリシー（CachingOptimized）を使用
    cache_policy_id = data.aws_cloudfront_cache_policy.caching_optimized.id
  }

  # SPAのルーティング対応（403/404をindex.htmlへ）
  custom_error_response {
    error_code            = 403
    response_code         = 200
    response_page_path    = "/index.html"
  }

  custom_error_response {
    error_code            = 404
    response_code         = 200
    response_page_path    = "/index.html"
  }

  viewer_certificate {
    acm_certificate_arn      = aws_acm_certificate_validation.static_site.certificate_arn
    ssl_support_method       = "sni-only"
    minimum_protocol_version = "TLSv1.2_2021"
  }

  restrictions {
    geo_restriction {
      restriction_type = "none"
    }
  }

  tags = {
    Name        = "${var.project}-cdn"
    Environment = var.environment
  }
}

# AWSマネージドキャッシュポリシーの参照
data "aws_cloudfront_cache_policy" "caching_optimized" {
  name = "Managed-CachingOptimized"
}

# providers.tf
provider "aws" {
  region = "ap-northeast-1"   # メインリージョン（S3・Route 53等）
}

provider "aws" {
  alias  = "us_east_1"
  region = "us-east-1"        # ACM証明書専用
}

# acm.tf
resource "aws_acm_certificate" "static_site" {
  provider          = aws.us_east_1    # us-east-1で作成（必須）
  domain_name       = var.domain_name
  validation_method = "DNS"

  lifecycle {
    create_before_destroy = true
  }
}

# DNS検証レコードをRoute 53に自動作成（for_eachでドメイン数に対応）
resource "aws_route53_record" "cert_validation" {
  for_each = {
    for dvo in aws_acm_certificate.static_site.domain_validation_options :
    dvo.domain_name => {
      name   = dvo.resource_record_name
      record = dvo.resource_record_value
      type   = dvo.resource_record_type
    }
  }

  zone_id = data.aws_route53_zone.static_site.zone_id
  name    = each.value.name
  type    = each.value.type
  records = [each.value.record]
  ttl     = 60
}

resource "aws_acm_certificate_validation" "static_site" {
  provider                = aws.us_east_1
  certificate_arn         = aws_acm_certificate.static_site.arn
  validation_record_fqdns = [for record in aws_route53_record.cert_validation : record.fqdn]
}

# route53.tf
data "aws_route53_zone" "static_site" {
  name         = var.root_domain   # 例: "example.com"
  private_zone = false
}

resource "aws_route53_record" "static_site" {
  zone_id = data.aws_route53_zone.static_site.zone_id
  name    = var.domain_name        # 例: "www.example.com"
  type    = "A"

  alias {
    name                   = aws_cloudfront_distribution.static_site.domain_name
    zone_id                = aws_cloudfront_distribution.static_site.hosted_zone_id
    evaluate_target_health = false   # CloudFrontはヘルスチェック不要
  }
}

$ terraform plan

Terraform will perform the following actions:

  # aws_acm_certificate.static_site will be created
  + resource "aws_acm_certificate" "static_site" {
      + id            = (known after apply)
      + domain_name   = "www.example.com"
      + validation_method = "DNS"
      ...
    }

  # aws_cloudfront_distribution.static_site will be created
  + resource "aws_cloudfront_distribution" "static_site" {
      + id          = (known after apply)
      + domain_name = (known after apply)
      + aliases     = ["www.example.com"]
      + price_class = "PriceClass_200"
      ...
    }

  # aws_cloudfront_origin_access_control.static_site will be created
  + resource "aws_cloudfront_origin_access_control" "static_site" {
      + signing_behavior = "always"
      + signing_protocol = "sigv4"
      ...
    }

  # aws_s3_bucket.static_site will be created
  + resource "aws_s3_bucket" "static_site" {
      + id     = (known after apply)
      + bucket = "myproject-prod-static-site"
      ...
    }

Plan: 9 to add, 0 to change, 0 to destroy.

$ terraform apply -auto-approve

aws_s3_bucket.static_site: Creating...
aws_s3_bucket.static_site: Creation complete after 3s [id=myproject-prod-static-site]
aws_s3_bucket_public_access_block.static_site: Creating...
aws_s3_bucket_public_access_block.static_site: Creation complete after 1s
aws_cloudfront_origin_access_control.static_site: Creating...
aws_cloudfront_origin_access_control.static_site: Creation complete after 2s
aws_acm_certificate.static_site: Creating...
aws_acm_certificate.static_site: Creation complete after 5s
  [id=arn:aws:acm:us-east-1:123456789012:certificate/xxxx-xxxx-xxxx-xxxx]

# DNS検証レコードを自動作成（約30秒）
aws_route53_record.cert_validation["www.example.com"]: Creating...
aws_route53_record.cert_validation["www.example.com"]: Creation complete after 32s

# ACM証明書のDNS検証完了待ち（5～10分）
aws_acm_certificate_validation.static_site: Still creating... [1m0s elapsed]
aws_acm_certificate_validation.static_site: Still creating... [4m0s elapsed]
aws_acm_certificate_validation.static_site: Creation complete after 5m48s

# CloudFront Distributionのデプロイ（10～15分）
aws_cloudfront_distribution.static_site: Still creating... [5m0s elapsed]
aws_cloudfront_distribution.static_site: Still creating... [10m0s elapsed]
aws_cloudfront_distribution.static_site: Creation complete after 13m21s
  [id=E1XXXXXXXXXXXXXXXXX]

Apply complete! Resources: 9 added, 0 changed, 0 destroyed.

Outputs:
cloudfront_domain_name = "dxxxxxxxxxxxx.cloudfront.net"
s3_bucket_name = "myproject-prod-static-site"

# テスト用のindex.htmlをS3にアップロード
$ aws s3 cp index.html s3://myproject-prod-static-site/

# HTTPからHTTPSへのリダイレクトを確認（301 Moved Permanently）
$ curl -I http://www.example.com/
HTTP/1.1 301 Moved Permanently
Location: https://www.example.com/
Server: CloudFront
X-Cache: Redirect from cloudfront

# HTTPSでのアクセスを確認
$ curl -I https://www.example.com/
HTTP/2 200
content-type: text/html
x-cache: Miss from cloudfront
via: 1.1 xxxxxxxxxxxxxxxxxxxxxxxxxx.cloudfront.net (CloudFront)
x-amz-cf-pop: NRT51-P3

# 証明書の検証ステータスを確認
$ aws acm describe-certificate \
  --certificate-arn arn:aws:acm:us-east-1:123456789012:certificate/xxxx \
  --region us-east-1 \
  --query 'Certificate.DomainValidationOptions[0].ValidationStatus'
"PENDING_VALIDATION"

# Route 53にCNAMEレコードが存在するか確認
$ aws route53 list-resource-record-sets \
  --hosted-zone-id /hostedzone/XXXXXXXXXX \
  --query 'ResourceRecordSets[?Type==`CNAME`].Name'

# ACM証明書のリージョンを確認（us-east-1である必要がある）
$ terraform state show aws_acm_certificate.static_site | grep -E 'arn|region'
id = "arn:aws:acm:us-east-1:123456789012:certificate/xxxx"

# ap-northeast-1で誤作成した場合は、provider = aws.us_east_1 を追加して再作成する
# terraform destroy -target=aws_acm_certificate.static_site
# terraform apply -target=aws_acm_certificate.static_site