항해99

TIL 18 SPA 프로젝트 배포시 404 (Not Found) 에러가 생기는 문제

kongom2 2021. 11. 18. 00:28

404 (Not Found)

리액트를 아무런 처리없이 빌드하고 배포하고 나서, 특정 URL로 바로 접근 시 생기는 에러

리액트라서 생기는 문제이라기 보다 SPA이 가진 특징 때문에 생기는 문제

왜 이런 에러가 발생 하는가

Base가 되는 URL을 단 하나인 index.html에 연결시켜 배포하지만, 다른 URL로 접속하면 해당 URL에 맞는 html을 다시 찾으려고 하기 때문에 발생.

따라서, Base가 되는 URL이 아닌 다른 URL을 통해 사이트에 접속해도, index.html을 연결시켜 배포하는 작업이 필요

S3 서버에서의 처리 방법

S3에서는 정적 웹 사이트 호스팅 편집에서 인덱스 문서와 오류문서를 index.html 하나로 설정하면 해결

참조 https://leonkong.cc/posts/til-react-router-s3-cloudfront.html

그 외 서버에서 처리방법(nginx, apache, node express)

간단히 코드를 추가함으로써 해결 가능

참조 https://wkdtjsgur100.github.io/react-router-deploy/