AWS S3, CloudFront, Route53으로 정적 웹페이지 호스팅하기

정적 웹페이지를 호스팅하려고 직접 웹서버를 설치하고 파일 올려놓기는 귀찮아...

그냥 AWS S3로 간단하게 끝낸다. 아래 방식으로 한다.

 

client → [Route53] → [CloudFront] → S3

 

Route53은 DNS 서비스이고, CloudFront는 CDN 서비스이다.

Route53와 CloudFront를 통해

• tistory.com 같은 도메인으로 접근
• HTTPS를 사용
• 엣지 포인트에 캐싱되어 빠른 속도로 서비스
• 비용 절감 (S3보다 CloudFront가 저렴)

 

1. S3 버킷 생성하고 리소스 업로드하기

모든 퍼블릭 액세스 차단을 설정한다. 사용자가 직접 S3에 접근하는 것을 막을 것이다.

리소스를 올릴 때도 마찬가지로 퍼블릭 읽기 액세스 권한을 부여하지 않는다.

 

2. ACM(Amazon Certificate Manager) 설정하기

CloudFront가 미국 동부(버지니아 북부)에서만 사용 가능하여 SSL 인증서도 미국 동부(버지니아 북부) 리전에 있어야 한다.
도메인 이름을 *.something.com으로 하여 서브 도메인들도 인증서를 사용할 수 있게 한다.

 

3. CloudFront 설정하기

• [배포 생성]을 누른다.
• 원본 도메인으로 위에서 만든 S3 버킷을 선택한다.
• Redirect HTTP to HTTPS를 설정했다.
• 대체 도메인 이름(CNAME)으로 static.something.com을 지정하고 위에서 만든 SSL 인증서를 연결한다.
• OAI 사용하여 CloudFront를 통해서만 S3 버킷에 접근하도록 한다.
  * OAI란? Original Access Identity. 특수 CloudFront 사용자로, CloudFront 배포와 연결하여 CloudFront를 통해서 파일에 접근하도록 한다. 이를 사용하면 S3 버킷명을 노출시키지 않을 수 있다. OAI를 사용하려면 OAI에 대한 액세스를 허용하도록 S3 버킷 정책을 수정해야 한다.

  {
      "Version": "2012-10-17",
      "Id": "PolicyForCloudFrontPrivateContent",
      "Statement": [
          {
              "Effect": "Allow",
              "Principal": {
                  "AWS": "arn:aws:iam::cloudfront:user/CloudFront Origin Access Identity EH1HDMB1FH2TC"
              },
              "Action": "s3:GetObject",
              "Resource": "arn:aws:s3:::DOC-EXAMPLE-BUCKET/*"
          }
      ]
  }

• 이제 {CloudFront 배포 도메인 이름}/{S3 객체명}에 접근이 가능하다.
• 추가적으로 [오류 페이지 응답 생성]을 한다. S3에 기본 에러페이지를 올려두고 사용한다.

 

4. Route53 설정하기

내 도메인으로 접근할 수 있도록 Route53을 설정한다.

나는 이미 도메인을 가지고 있으므로 기존 호스팅 영역에 레코드를 추가한다.

• 레코드 이름을 static.something.com으로 지정한다.
• 트래픽 라우팅 대상('별칭' 활성화해야 보임)에 CloudFront 배포에 대한 별칭을 선택하고 지정한다.

 

이제 'static.something.com/{S3 객체명}'으로 접근이 가능하다! 끝났다!

 

 

Amazon S3를 사용하여 정적 웹 사이트 호스팅 - Amazon Simple Storage Service