triplus) 에러 핸들링-catch 에러

어느정도 기능 구현을 끝내고 기능 테스트를 하던 중에..!

createGuide(formData).then((res) => {
	if(res.status === 200) {
    	//성공시 처리
    } else {
    	//실패시 처리
    }
})

이렇게 작성되어 있던 코드에서 문제가 발생했다. 서버에서 200번 응답을 보내줄 때에는 원하는 대로 동작하는데, 그 외에 경우가 동작이 안되는 문제를 발견했다.

module.exports = {
  createGuideCard: async (req) => {
    let resObject = {};
    const insertValue = checkParams(req.body);
    const accessToken = isAuthorized(req);

    // 토큰이 없었을 때
    try {
      if (!accessToken) {
        throw 'accessToken이 없습니다';
      }
      insertValue['userId'] = accessToken.userId;
      insertValue['state'] = GLOBAL_VARIABLE.APPROVED;
    } catch (error) {
      console.log(`ERROR: ${error}`);
      resObject['code'] = 200;
      resObject['message'] = error;
      return resObject;
    }

    try {
      const guideCard = await guide_card.create(insertValue);
      const userData = await user.update(
        {
          gender: req.body.gender === 'true' ? 1 : 0,
        },
        {
          where: { userId: accessToken.userId },
        }
      );

      if (req.files.length > 0) {
        const guideImages = [];
        for (let guideImage of req.files) {
          guideImages.push({ guideId: guideCard.dataValues.guideId, image: guideImage.location });
        }

        guide_image.bulkCreate(guideImages);
      }

      resObject['code'] = 200;
      resObject['message'] = '가이드 카드를 작성하였습니다';
    } catch (error) {
      console.log(error);
      resObject['code'] = 400;
      resObject['message'] = '가이드 카드를 작성하지 못하였습니다';
    } finally {
      return resObject;
    }
  },

서버에서 try catch문을 사용해 400번대 코드를 보내주고 있었는데, 400번대 응답은 에러라서, 클라이언트에서 catch로 에러상황에 대한 처리를 해주어야 하는 걸 간과해서 생긴 문제였다.

이런 문제 때문에 큰 회사에서는 본인들만의 응답코드를 만들어서 사용하는 걸까 싶었다.
아무튼! catch문을 이용해 클라이언트 코드를 수정해주었다.

	createGudie(formData)
        .then((res) => {
          if (res.data.message === 'accessToken이 없습니다') {
            dispatch(exit());
            alert('로그인이 만료되어 로그인페이지로 이동합니다.');
            navigate('/login');
            setIsLoading(false);
          } else {
            handleComplete();
            navigate('/management');
          }
        })
        .catch((error) => {
          alert('잠시후에 다시 시도해주세요');
          navigate('/management');
        });