[React Error] API 404 Not Found error

고병표·2022년 12월 7일
0

Error 모음

목록 보기
13/13
post-thumbnail

😥 새롭게 추가된 API 호출했을 때 발생한 에러

새로운 프로젝트를 시작하면서 기존 프로젝트에는 없었던 기능을 추가하게 되었다.

때문에 새롭게 API를 호출하게 되었는데 기존의 다른 API call 과는 다르게 404 Not Found가 발생했다.

또한, 아래 사진과 같이 요청 URL에 원하지 않은 주소 /web/outlook 가 자동으로 추가되었다. (의도한 주소 test.~/web/key~~)

처음에는 url을 잘못 입력한 줄 알았지만, local 환경과 test 서버 환경을 비교 했을 때 test 서버에서만 에러가 발생하였다.

🤔 에러 발생 이유

결론적으로 에러가 발생한 원인은 URL 타이핑 오류였다...

어떻게 보면 쉬운 문제라 글을 작성해야하나 고민했지만, 같은 실수를 반복하지 않기 위해 작성하기로 했다.

우선 잘못 타이핑 한 url은 이 부분이였다.

두 사진의 차이점은 url이 /web으로 시작하는지 web/으로 시작하는지였다.

web/ 으로 시작하였을 때 문제가 발생하였는데 이 프로젝트는 웹팩에서 devServer를 통해 proxy로 api 호출을 경유한다 (cors 문제 때문에)

아래의 사진과 같이 /web 으로 시작하는 url만 처리되었기에 문제가 발생했던 것이다.

그럼 local 환경에서는 왜 잘 작동했을까?

그 해답은 아래 사진과 같이 기본 url 끝에 '/' 이 있었기 때문이다...

🔥 How to fix ?

특별한 해결 방법은 없었다. 그냥 url 앞에 '/'만 추가했다.

조금은 허무할 정도로 쉬운 방법이었지만, 최근 프로젝트 완성을 위해 너무 달려가기만 한 경고? 같다는 생각이 들었다.

프로젝트 기간 중에 힘든 만큼 새로 배웠던 것도 많았는데, 잊기 전에 빨리 작성해야겠다.

0개의 댓글