HomeAboutMeBlogGuest
© 2025 Sejin Cha. All rights reserved.
Built with Next.js, deployed on Vercel
🧚
[1기]최종 프로젝트 데브코스
/
[팀7] 뿡치와 삼촌들 - Devnity
[팀7] 뿡치와 삼촌들 - Devnity
/
📘
프론트엔드 공간
/
🧑‍🎓
Today We Learned
/
📃
react-query (작성중)
📃

react-query (작성중)

생성일
Dec 8, 2021 12:11 PM
기록자
PuReum Kang
해결 여부
속성
카테고리

🔥 문제 및 질문

까먹을까봐 해결했던 현상 먼저 간략하게 기록해놓고 나중에 정리해놓을게요~

 
  • 백엔드 API 호출 후 500에러를 받았을 때 Axios에서는 제대로 에러 정보를 가져올 수 있었지만 react-query에서 가져오지 못했음 (useMutation의 onError 핸들러가 호출될것이라 생각됐지만 계속 onSuccess가 호출되었음)
  • 링크 글을 확인해보니 Axios에서 500에러를 받아도 react-query에선 실패로 보지 않는 것 같았음
  • onError가 정확히 어느 조건에 발생하는지 찾아봐야함
 

📢 해결 과정

  • axios의 인터셉터 설정을 다음과 같이 추가해줬음
axiosInstance.interceptors.response.use( // onFulfilled (res) => { return res; }, // onRejected (res) => { return Promise.reject(res); } );
부가설명 하자면 500에러를 받았을 때 onRejected가 호출되는데 이 때 리턴값으로 reject된 Promise를 넘겨주면 useMutation의 onError에서 해당 에러를 받아 처리할 수 있다!

📃 참고자료