[AWS CloudFront] CloudFront에서 API Gateway로 요청 전달

이제 이전 과정들에 이어서 마지막으로 사용자의 요청을 CloudFront에서 받아서 /api로 들어오는 요청은 API Gateway로 나머지 요청은 S3에 저장된 프론트엔드가 응답하도록 구성하겠습니다.

 

먼저, S3에 프론트엔드 소스를 올리고 CloudFront로 서비스하는 방법은 여기서 설명하지 않겠습니다.

 

이미 S3에 프론트엔드 소스가 올라가 있고 CloudFront로 서비스를 하고 있는 상태에서 /api로 들어오는 요청은 S3가 아닌 API Gateway로 전달하는 방법을 알아보겠습니다.

 

1. CloudFront에 원본 추가

먼저 CloudFront 원본에 API Gateway를 추가해줍니다.

 

 

2. CloudFront에 동작 추가

아래와 같이 동작을 생성합니다.

 

 

헤더와 쿼리 문자열은 별도 설정이 필요합니다. 여기서 전달할 헤더와 쿼리 문자열을 포함해줘야 API Gateway에 제대로된 요청이 전달됩니다.

 

이제 모든 설정이 끝났습니다. CloudFront가 배포되면 배포 도메인 이름 또는 대체 도메인 이름을 통해 접속하여 도메인명/api/XXX로 요청을 보내면 API Gateway로 전달되어 ECS로 서비스되고 있는 백엔드 소스에서 응답을 받아 다시 프론트엔드로 전달하게 됩니다.

 

전체적인 구성은 다음과 같습니다.