AWS

CloudFront를 활용한 S3 앱 배포하기

JAEJUNG 2021. 8. 12. 14:17
Overview

1. S3 버킷 생성하기

2. 파일 업로드하기

3. CloudFront로 S3 버킷의 정적 파일 배포하기

++ 4. EC2 DNS 접속 vs CloudFront 도메인 접속 로그 비교

 

이번 실습에선 S3에 정적 웹 파일을 업로드하고 CloudFront 서비스로 이 웹 서비스를 배포하는 과정을 설명한다.

 

Step.1 S3 버킷 생성하기

S3 버킷을 생성하는 자세한 과정은 생략하도록 한다.

 

외부에서의 접속 테스트를 위해 "모든 퍼블릭 액세스 차단" 설정은 비활성화 시키도록 한다.

 

버킷 정책에서 아래와 같이 정책을 추가한다.

아래 정책은 모든 사용자가 읽기 권한을 가지도록 하는 정책이다.

#Resource의 ljj-s3는 본인의 버킷 이름을 기입한다.

{
   "Version":"2012-10-17",
   "Statement":[
        {
             "Sid":"AddPerm",
             "Effect":"Allow",
             "Principal": "*",
             "Action":["s3:GetObject"],
             "Resource":["arn:aws:s3:::ljj-s3/*"]
          }
     ]
}

 

Step2. 파일 업로드하기

버킷을 생성했으면 아래와 같이 폴더 전체를 업로드해준다.

cf_lab1.tar.gz
7.54MB

 

객체 URL을 접속하여 웹 페이지를 확인한다.

 

Step3. CloudFront로 S3 버킷의 정적 파일 배포하기

이제 CloudFront에서 웹 배포를 위한 새 Distribution을 생성해주자.

 

여러 옵션이 있지만 간단한 실습을 위해 S3와 연동하기 위한 "Origin domain" 옵션에서

조금 전 생성했던 s3 버킷을 선택한다.

 

스크롤을 아래로 내려 [Create Distribution]을 클릭한다.

 

이렇게 새로운 CloudFront 배포판이 생성됐다.

아래 "Distribution domain name"의 URL이 CDN이 적용된 주소이다.

 

이제 컨텐츠가 잘 배포됐는지 확인하기 위해 아래 URL로 접속해보자.

여기서 ~.clondfront.net의 값은 각자 다르니 본인의 값으로 변경하여 접속한다.

dctazd72j3jxn.cloudfront.net/cf_lab1.tar/cf_lab1/cf_lab1.html

 

아래와 같이 S3의 컨텐츠가 표시되는 것을 확인할 수 있다.

 

이미지를 클릭하여 [새 탭에서 이미지 열기]를 클릭해보자.

 

URL을 확인해보면 CloudFront에서 해당 이미지를 자동으로 호스팅하고 있다.

 

Step.4 EC2 DNS 접속 vs CloudFront 도메인 접속 로그 비교 

EC2 웹 서버에 할당된 퍼블릭 DNS 주소로 접속한 후 로그를 확인해보자.

로그는 /var/log/httpd/access.log 파일을 확인하면 된다.

 

- EC2 인스턴스 도메인으로 접속 시

(신기한 점은 카카오톡으로 스크랩을 했는지, 브라우저는 어떤 것인지, 모바일로 접속했다면 기종, os 정보까지 다 나온다)

 

- CloudFront 도메인으로 접속 시

로그에 "Amazon CloudFront" 라고 표시되며, 그 외 브라우저 종류 같은 다양한 정보는 로그에 출력되지 않는다.

 

이제 CloudFront에서 실제로 Origin의 Content를 캐시하는지 확인해보자.

 

/var/www/html에서 index.html 파일을 생성한다.

[root@ip-172-31-22-199 httpd]# cat /var/www/html/index.html 
hello html

 

퍼블릭 DNS 주소로 접속하면 html 파일에 작성한 내용을 확인할 수 있다.

 

CloudFront 도메인을 접속하면 동일하게 컨텐츠 내용을 확인할 수 있다.

그럼 로그를 확인해보자.

 

EC2 도메인은 접속할 때마다 로그가 찍힌다.

이는 원본에 접속하여 계속해서 컨텐츠에 접근한다고 볼 수 있다.

 

반면 CloudFront 도메인은 최초 접속 시에만 로그가 기록된다.

이는 최초 접속할 땐 캐시된 컨텐츠가 없기 때문에 Origin에 액세스하고 그 후엔 캐시된 컨텐츠를 제공하기 때문에

웹 서버에 액세스하지 않는다.