【Terraform】S3で静的なWebサイトを公開する

目標
やること
バケットの作成
静的ウェブサイトホスティングの有効化
バケットポリシーの編集
ファイルのアップロード
おまけ
課題
参考

目標

S3で静的なWebサイトを公開する。

やること

バケットの作成
静的ウェブサイトホスティングの有効化
バケットポリシーの編集
ファイルのアップロード

バケットの作成

バケット名はグローバルで一意でなければならない。
また、独自ドメインを設定する場合はドメイン名と同じにする。
※ CloudFrontに対して独自ドメインを設定する場合は同じにする必要はない。

provider "aws" {
  region = "ap-northeast-1"
}

resource "aws_s3_bucket" "bucket" {
  bucket = "{バケット名}"
}

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

provider "aws" {
  region = "ap-northeast-1"
}

resource "aws_s3_bucket" "bucket" {
  bucket = "{バケット名}"
  acl = "public-read"
  website {
    index_document = "index.html"
  }
}

バケットポリシーの編集

provider "aws" {
  region = "ap-northeast-1"
}

resource "aws_s3_bucket" "bucket" {
  bucket = "{バケット名}"
  acl = "public-read"
  website {
    index_document = "index.html"
  }
}

resource "aws_s3_bucket_policy" "bucket_policy" {
  bucket = aws_s3_bucket.bucket.id
  policy = data.aws_iam_policy_document.policy_document.json
}

data "aws_iam_policy_document" "policy_document" {
  statement {
    sid = "Statement1"
    effect = "Allow"
    principals {
      type = "*"
      identifiers = ["*"]
    }
    actions = [
      "s3:GetObject"
    ]
    resources = [
      "${aws_s3_bucket.bucket.arn}/*"
    ]
  }
}

ファイルのアップロード

provider "aws" {
  region = "ap-northeast-1"
}

resource "aws_s3_bucket" "bucket" {
  bucket = "{バケット名}"
  acl = "public-read"
  website {
    index_document = "index.html"
  }
}

resource "aws_s3_bucket_policy" "bucket_policy" {
  bucket = aws_s3_bucket.bucket.id
  policy = data.aws_iam_policy_document.policy_document.json
}

data "aws_iam_policy_document" "policy_document" {
  statement {
    sid = "Statement1"
    effect = "Allow"
    principals {
      type = "*"
      identifiers = ["*"]
    }
    actions = [
      "s3:GetObject"
    ]
    resources = [
      "${aws_s3_bucket.bucket.arn}/*"
    ]
  }
}

resource "aws_s3_bucket_object" "bucket_object" {
  bucket = aws_s3_bucket.bucket.id
  key = "index.html"
  source = "index.html"
  content_type = "text/html"
}

今回は動作確認のため、以下の内容のファイルをアップロードして
「Hello, S3!」と表示されることを確認する。

index.html

<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="utf-8">
    <title>【Terraform】S3で静的なWebサイトを公開する</title>
  </head>
  <body>
    <p>Hello, S3!</p>
  </body>
</html>

プロパティの静的ウェブサイトホスティングにある
バケットウェブサイトエンドポイントからアクセスする。
http://{バケット名}.s3-website-ap-northeast-1.amazonaws.com/

「Hello, S3!」と表示されれば完了。

おまけ

buildディレクトリのすべてのファイルをアップロードする。

provider "aws" {
  region = "ap-northeast-1"
}

resource "aws_s3_bucket" "bucket" {
  bucket = "{バケット名}"
  acl = "public-read"
  website {
    index_document = "index.html"
  }
}

resource "aws_s3_bucket_policy" "bucket_policy" {
  bucket = aws_s3_bucket.bucket.id
  policy = data.aws_iam_policy_document.policy_document.json
}

data "aws_iam_policy_document" "policy_document" {
  statement {
    sid = "Statement1"
    effect = "Allow"
    principals {
      type = "*"
      identifiers = ["*"]
    }
    actions = [
      "s3:GetObject"
    ]
    resources = [
      "${aws_s3_bucket.bucket.arn}/*"
    ]
  }
}

module "template_files" {
  source = "hashicorp/dir/template"
  base_dir = "build"
}

resource "aws_s3_bucket_object" "bucket_object" {
  for_each = module.template_files.files

  bucket = aws_s3_bucket.bucket.id
  key = each.key
  source = each.value.source_path
  content_type = each.value.content_type
}