Route53 + API Gateway + S3 정적 웹 호스팅

S3에서는 웹 사이트에 대한 HTTPS 액세스를 지원하지 않기 때문에 HTTPS 를 사용하기 위해서는 API Gateway 또는 Cloudfront를 앞에 붙여서 사용해야한다.

이번에는 S3 앞에 API Gateway를 붙여서 HTTPS 로 접근할 수 있도록 구성하고 Route53 을 추가하여 사용자 지정 도메인으로 S3 웹에 접근하는것 까지 해보려고 한다.

 

👇 S3 정적 웹 생성 참고 글

[1] Route53 + API Gateway + S3 정적 웹 호스팅

 

---

🔧 API Gateway 생성하기

먼저 API Gateway 콘솔로 들어가서 API Gateway 를 생성한다. 

여기서는 REST API 유형의 API Gateway를 구축하였다.

 

API Gateway 이름을 작성하고 생성을 완료한다.

 

이제 GET메서드를 하나 생성한다.

HTTP 유형으로 지정한 뒤 엔드포인트 URL에 S3 웹 엔드포인트를 넣어준다.

여기서 HTTP 프록시 통합 사용을 체크해주어야 파일들이 소스코드로 보여지지 않는다! 이것 때문에 파일들이 다 깨져서 보여서 엄청 고생했다..

 

이번엔 파일을 불러오기 위한 리소스를 생성한다.

리소스 이름에 {file} 을 입력한다. 아래 설명에 나와있듯이 중괄호를 사용하여 경로 파라미터를 지정해줄 수 있다.

 

위에서 생성했던것과 똑같이 리소스 아래에 GET메서드를 생성하고 S3 웹 엔드포인트뒤에 /{file} 을 추가해준 뒤 저장한다.

 

이제 API 배포 작업을 한다. 

 

API 배포 후 HTTPS로 시작하는 URL이 생성되고 해당 URL로 접근하면 S3 웹이 잘 뜨는것을 확인할 수 있다.

 

이제 저 길고 긴 API Gateway 엔드포인트로 웹에 접근하는것은 예쁘지 않으니까 사용자 지정 도메인을 사용하여 웹에 접근해보도록 한다.

이때 API Gateway 에서 사용자 지정 도메인을 생성하려면 ACM 이 발급되어야한다. ACM 발급 과정은 이번 포스팅에서 생략되었는데 담에 Route53 호스팅영역 생성까지해서 포스팅해봐야겠다..

 

API Gateway 콘솔에서 사용자 지정 도메인 이름을 선택하고 도메인 생성을 시작한다.

도메인 이름을 입력하고 ACM 인증서를 선택한 뒤 생성을 완료한다.

이때 여기서 입력한 도메인 이름과 이후 Route53에서 생성할 레코드 이름이 같아야한다.

 

도메인이 생성!

이제 옆에 API 매핑 탭으로 가서 API 를 매핑해준다.

 

새 매핑 추가를 클릭하여 생성한 API를 추가한 뒤 저장한다.

 

매핑 끝!

 

 

🔧 Route53 레코드 생성하기

Route53 콘솔로 들어가서 호스팅 영역을 선택하고 레코드를 생성을 시작한다. 단순 라우팅 선택 후 다음!

 

단순 레코드 정의를 클릭하고 생성할 레코드 정보를 입력한다.

레코드 이름 : 위에서 언급했듯이 해당 레코드이름과 API Gateway의 사용자 지정 도메인 이름이 같아야한다.

레코드 유형 : A ‐ IPv4 주소 및 일부 AWS 리소스로 트래픽 라우팅 선택

값/트래픽 라우팅 대상 : API Gateway API에 대한 별칭(Alias to API Gateway API)을 선택

 

레코드 생성을 완료한다.

 

이제 해당 레코드이름으로 접근하면 https로 S3웹에 연결되는것을 확인할 수 있다.

 

 

참고한 AWS 공식문서

도메인 이름을 사용하여 Amazon API Gateway API로 트래픽 라우팅 - Amazon Route 53

 

근데 이렇게 API Gateway를 붙이는 방법 보다는 Cloudfront를 사용하는게 더 권장되는것 같다.

다음 포스팅은 Route53 + Cloudfront + S3 웹이다.