AWS S3와 CloudFront를 활용한 정적 웹사이트 호스팅

1. 구성도

1.1. S3를 활용한 구성

1.2. S3 + CloudFront를 활용한 구성

---

2. S3 정적 웹사이트 구성

• S3 생성

• S3 > 버킷 만들기 > 버킷 이름과 리전 설정 > 버킷 만들기(속도 테스트를 위해 대한민국과 지리적으로 먼 임의의 해외 리전 선택)

• 생성한 버킷에 파일 업로드

 

• S3 호스팅 기능 활성화

• S3 > 속성 > 정적 웹 사이트 호스팅 편집 > 활성화 > 인덱스 문서 설정 > 변경사항 저장

• 버킷 엔드포인트로 접근 시 403 확인

 

• 버킷 접근권한 설정

• S3 > 권한 > 퍼블릭 액세스 차단(버킷 설정) 편집 > 모든 퍼블릭 액세스 차단 체크 해제 > 변경 사항 저장

 

• 오브젝트 접근권한 설정

• S3 > 권한 > 버킷 정책 편집 > 아래 정책 붙여넣기 > 변경 사항 저장

{
"Id": "Policy1677651198477",
"Version": "2012-10-17",
"Statement": [
  {
    "Sid": "Stmt1677651196313",
    "Action": [
      "s3:GetObject"
    ],
    "Effect": "Allow",
    "Resource": "버킷 ARN 입력/*",
    "Principal": "*"
  }
]
}

 

• 버킷 엔드포인트 정상 접근 확인

---

3. CloudFront 추가 구성

• CloudFront 생성

• CloudFront > CloudFront 배포 생성 > 원본 도메인에 정적 호스팅용 버킷 선택 > 웹 사이트 엔드포인트 사용 > 배포 생성

• 배포 도메인을 통해 접근 확인

---

4. S3 vs CloudFront 속도 비교

• S3

• S3로만 서빙할 경우 5초 ~ 9초 소요
• CloudFront

• CloudFront를 구성하는 경우 1초 ~ 2초 소요

---

5. 참고

1. https://www.inflearn.com/course/aws-%ED%81%B4%EB%9D%BC%EC%9A%B0%EB%93%9C-%EC%9D%B8%ED%94%84%EB%9D%BC-%EA%B8%B0%EB%B3%B8