[AWS] S3와 Cloudfront 연결 후 403, 404 error 발생하는 이슈, 해결 방법

💣 Cloudfront 연결 후 403 error...

→ 배포를 하며 만났던 이슈 중 403 error는 생각보다 간단하게 해결할 수 있었던 이슈이지만, 같은 이슈를 또 경험하지 않게 이슈 원인과 해결 방법들을 정리해두려고 한다.

1. 이슈

→ S3와 Cloudfront 연결 후 403 error, Access Denied 에러 메세지가 뜨게 되었다.

2. 원인

→ Cloudfron ~ S3 로 서비스하는 구조에서,S3에 SPA(React)를 이용하여 구성을 하면 Redirect가 발생하여 403/404와 같은 Access Denied가 발생하게 된 것이다.

3. 해결 방법

→ 403, 404의 에러 페이지를 index.html로 하고 HTTP 응답코드를 200으로 설정하면 되었다.

1) CloudFront → 배포 → 배포하고자 하는 ID → 오류 페이지 접속
2) 오류 페이지에서 사용자 정의 오류 응답 생성 클릭
3) 응답 페이지 경로 : /index.html, HTTP 응답 코드 : 200 으로 생성
4) 에러 해결 !