🔥 문제 및 질문
까먹을까봐 해결했던 현상 먼저 간략하게 기록해놓고 나중에 정리해놓을게요~
- 백엔드 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에서 해당 에러를 받아 처리할 수 있다!