React s3 cloudfront 라우팅 문제 질문입니다.

리액트는 빌드후 aws cli s3를 통해서 s3에 업로드햇구요. 앞에 cloudfront를 연결 했구요.

ACM과 도메인을 연결했구요. 메인페이지는 잘 나옵니다.

리액트 라우터가 잘 안되는 문제인데

Ex) localhost/auth/login 이라 하면 CSR만 랜더링되는 구조입니다(서버에서 데이터받아오는 작업없습니다)
—> 이경우는 잘 나옵니다 ( react router가 잘 작동합니다 )

Ex) <도메인> 입력시 잘나옵니다. 그 도메인에서 컴포넌트 클릭해서 이동 or URL로 <도메인>/auth/login

이동시 오류가 뜹니다 ( Error from cloudfront 뜨고 브라우저가 랜더링이 안되서 죽어버립니다(?) )

추가적으로 설정한 것은

cloudfront error page 의 error code 403,404 를 response code : 200 와 response page path : /index.html

S3 정적 호스팅 부분에서 인덱스 문서, 오류 문서 : index.html로 했습니다.

무엇이 문제인가요 ?

감사합니다

컴포넌트 클릭시 이동한다고 하셨는데 이동하는 코드가 어떻게 되나요?

아 도메인을 직접 눌러도 안된다고 하셨군요… :slight_smile: 공개해도 문제가 되지 않는다면 해당 사이트 주소와 관련 코드를 공유해주시면 다른 분들이 원인을 찾는데 도움이 될 것 같아요.

@Mara_Amule 해결 되셨나요? 해결 되셨다면 어떤게 문제였는지 공유해주시면 감사하겠습니다~ :slight_smile:

흠…제대로 하신것 같은데…아마 클라우드프론트가 invalidate되기 전에 확인하신거 아닐까요? 그 전에 저 셋팅이 없이 배포하셨다면…