AWS 배포 하기 - 4 (S3 + CloudFront)

웹 페이지 배포하기 (S3 , CloudFront)

웹 서비스를 배포할 때 사용하는 S3 , CloudFront

• S3 는 파일 저장 서비스의 역할 뿐만 아니라 부가적인 기능을 더 가지고 있다.
• 그 기능은 바로 "정적 웹 사이트 호스팅" 이다.
• 웹 서비스를 다른 사용자들도 쓸 수 있게 인터넷에 배포하는 걸 뜻한다.
• CloudFront 는 컨텐츠(파일 , 동영상 등)를 빠르게 전송하게 해주는 서비스이다.

AWS CloudFront 작동 과정

• 컨텐츠(파일 , 이미지, 동영상등)는 S3 라는 곳에 저장될 것인데, S3 저장소가 만약 한국에 있었다면 한국 사용자는 거리가 가깝기 때문에 데이터를 빠르게 전송 받을 수 있다.
• 하지만 미국에 있는 사용자가 S3 로부터 데이터를 전송 받으려면 거리가 멀어 시간이 오래 걸리게 한다.
• 이러한 문제를 해결하기 위해 전세계 곳곳에 컨텐츠의 복사본을 저장해놓을 수 있는 임시 저장소를 구축한다.
• 미국에 있는 사용자가 컨텐츠를 전송바독 싶을 떄, 가장 가까운 임시 저장소에서 컨텐츠를 가져오면 훨씬 속도가 빨라진다.

이러한 서비스를 CDN(Content Delivery Network) 이라고 하며, CloudFront 를 CDN 서비스라고도 표현한다.

CloudFront 사용 이유?

• S3 만 사용해도 웹 서비스를 배포할 수 있긴 한데 왜 굳이 CloudFront 를 사용할까?
• CloudFront 는 컨텐츠를 전송 받는 성능을 향상시키기 위해 사용하기도 하고 HTTPS 를 적용하려면 CloudFront 를 사용해야한다.
• S3 에는 HTTPS 를 적용시키는 기능을 제공하고 있지 않기 떄문에 보안을 한층 강화할 수 있다.
• 그래서 S3 와 CloudFront 를 같이 써서 웹 서비스를 배포한다.

현업에서는 S3 + CloudFront 를 많이 사용할까?

• 현업에서 웹 서비스를 배포할 때 실제로 S3 와 CloudFront 를 많이 활용하고 있다.
• 물론 Netlify , Vercel , Cloudflare 와 같은 서비스들도 사용하기도 한다.

아키텍처 구성

• 사용자는 바로 S3 에 접근하는게 아니라 CloudFront 에게 요청을 하면 CloudFront 가 S3 로 요청을 보낸다.
• User -> Amazon CLoudFront -> Amazon S3

우선 실습을 위해 전에 배웠던 방법과 유사하게 S3 Bucket 을 만들면 된다.

• 만들면서 정책도 똑같이 작성하면 된다.

S3 에 업로드 하기 / 웹 호스팅 설정하기

• 만든 S3 버킷에 간단한 index.html 을 만들고 업로드 해준다.
• 그런후 S3 버킷에 들어가서 속성에 가보면 정적 웹 사이트 호스팅이 있는데 편집을 누른다.
• 정적 웹 사이트 호스팅을 활성화 하고 인덱스 문서에 우리가 업로드한 index.html 을 지정해주면 된다.
• 이렇게 만들고 나면 웹 사이트 엔드포인트가 나오는데 이 URL 로 접근해보면 우리가 만든 index.html 이 잘 나오는 것을 확인할 수 있다.

현재는 S3 에 업로드를 한 것이고 우리는 CloudFront 를 통해서 접근할 수 있도록 바꿔야 한다.

CloudFront 생성하기

• CloudFront 페이지에 들어가서 배포 생성을 누른다.
• 원본 도메인에 위에서 우리가 만든 S3 버킷을 선택하고 S3 정적 호스팅 웹 사이트의 엔드포인트를 사용
• 기본 캐시 동작에서 뷰어 프로토콜 정책을 Redirect HTTP to HTTPS 를 선택
• 웹 애플리케이션 방화벽은 보안 보호 비활성화를 선택
  -> 비활성화를 한다고 해서 보안이 취약해지는것이 아니기 때문에 선택해도 무방하다.
• 가격 분류에서는 북미 , 유럽 , 아시아 , 중동 및 아프리카에서 사용 선택
• 기본값 루트 객체는 우리가 만든 index.html 설정
• 생성하고 시간이 좀 지나면 배포 도메인 이름으로 접근해보면 index.html 이 잘 실행된다.

이제는 이 CloudFront 에 도메인을 연결하고 HTTPS 까지 적용해보자.

도메인 연결 + HTTPS 적용

• 전에 배웠듯이 HTTPS 적용을 위해서는 인증서를 발급 받아야 한다.
• Certificate Manager 에서 만들면 되는데 여기서 중요한 점은 CloudFront 에 HTTPS 를 적용하기 위해 인증서를 발급할 때 리전을 서울이 아니라 버지니아 북부로 설정을 해야한다.
• 요청을 누르고 도메인 이름 넣어주고 요청을 누르면 인증서가 만들어진다.
• 만든 후 인증서에 들어가보면 Route53 에서 레코드 생성을 누르고 검증을 해주면 된다.
• 다시 만든 CloudFront 에 들어가고 일반에서 편집을 누르고 대체 도메인 이름에 우리가 인증서 만들 때 설정한 도메인을 넣어주고 사용자 정의 SSL 인증서에 인증서를 선택해준다.
• 그런 후 변경 사항 저장해주면 된다.

인증서 적용을 해주고 해야할 것은 Route53 에서 CloudFront 에 도메인을 연결해줘야 한다.

• Route53 에 들어가서 우리가 가지고 있던 호스팅 영역(도메인)에 들어가서 레코드 생성을 눌러주고 레코드 이름 설정하고 레코드 유형은 A , 별칭은 CloudFront 배포에 대한 별칭을 선택하고 생성해주면 된다.

해당 도메인으로 접속해보면 정상적으로 index.html 의 화면이 나온다.

• 도메인도 적용이 됐고 HTTPS 도 잘 적용 된 것을 확인할 수 있다.