[FE] React query에서 axios 사용 시 retry를 한 번만 하는 현상

[Palwol]

이슈 내용

• react query에서 axios를 사용할 때, 에러 시 재요청이 retry로 설정한 횟수만큼 이루어지지 않고 1번만 이루어집니다.
  • 정확히는 retry가 2번 이루어지는데, 2번째 요청은 가지 않는 것 같습니다.
• react query에서 재요청을 막는 것인지, 아니면 axios retry 로직 문제인지 확인 중입니다.
• axios에서 에러 처리가 되면 react query의 retry 기능을 사용할 수 있는지 확인 중입니다.

기대 결과

• 에러 시 retry에 설정한 횟수만큼 재요청을 함.

[Palwol]

재요청 시 pending 상태인 이전 요청들을 취소하기 위해 사용했던 queryClient.cancelQueries()가 retry를 취소시키던 범인이었습니다.
axios에서 설정해두었던 retry 함수 자체는 실행되었으나, retry 함수 내에서 재요청을 보낼 때 cancleQueries에 의해 이전과 동일한 요청이 취소된 것으로 보입니다.

요약 : cancleQueries를 삭제하고, react query 자체의 retry 기능을 사용해서 retry 로직을 간단하게 변경했습니다.

참고로 재요청 시 pending 상태인 이전 요청들을 취소 이 기능은 cancleQueries를 사용하지 않아도 react query에서 자체적으로 마지막으로 보낸 요청에 대한 응답을 사용하도록 해주어서 별도로 처리하지 않아도 될 것 같습니다.