CLOUDFRONT_SETUP.md

CloudFront SPA 라우팅 설정 방법

배포 환경에서 /chat 같은 라우트가 작동하지 않는 문제는 CloudFront의 Error Pages 설정이 필요합니다.

해결 방법

AWS 콘솔에서 CloudFront 설정

1. AWS 콘솔 → CloudFront → Distributions → 해당 Distribution 선택
2. Error Pages 탭으로 이동
3. Create Custom Error Response 클릭
4. 다음 설정 추가:

403 에러:

• HTTP Error Code: 403: Forbidden
• Customize Error Response: Yes
• Response Page Path: /index.html
• HTTP Response Code: 200: OK
• TTL: 300 (5분)

404 에러:

• HTTP Error Code: 404: Not Found
• Customize Error Response: Yes
• Response Page Path: /index.html
• HTTP Response Code: 200: OK
• TTL: 300 (5분)

이렇게 설정하면 SPA의 모든 라우트가 index.html로 리다이렉트되어 React Router가 올바르게 작동합니다.

참고

• 변경사항 적용까지 약 5-10분 소요될 수 있습니다.
• 캐시 무효화가 필요할 수 있습니다.