type error

문제

어제 저녁 완성한 코드를 오늘 아침 테스트하다가 몇가지 오류가 발생했다.

그중에 해결하는데 가장 많은 시간이 걸렸던 오류가 type error였다.

게시글 수정 기능중에 게시물에 등록된 이미지 파일중 일부를 삭제하는 코드가 제대로 동작하지 않았다.

삭제할 이미지 파일의 id를 배열 형태로 받아 db에서 해당 id를 기준으로 데이터를 삭제해주는 로직이다.

현재 우리 프로젝트는 3 layered achitecture pattern을 적용중인데 service 계층에서 자꾸 type error가 발생했다.

 

 

controller 계층

const removeImgIdArray = req.body.removeImgId; // 삭제할 이미지 url_id의 배열

// 이미지 파일 삭제
if (removeImgIdArray !== undefined) {
await this.postService.deleteImage(removeImgIdArray);
};

 

service 계층

  // 게시글 수정 - img_url 삭제
  deleteImage = async (url_ids) => {
    await Promise.all(url_ids.map(async (url_id) => {
      await this.postRepository.deleteImage(url_id);
    }));
  };

 

repository 계층

  // 게시글 수정 - img_url 삭제
  deleteImage = async (url_id) => {
    console.log(url_id);
    await Images.destroy({where: {image_id: url_id}});
    return;
  };

 

 

시도

먼저 router에서 삭제할 이미지 파일의 배열을 console.log로 찍어 보았다.

터미널에 배열 형태가 확인되었다.

그래서 typeof를 활용해 type을 확인해 보았다. string으로 확인되었다.

왜 스트링이지..... 테스트를 thunder client로 진행했는데

form data 탭에 value를 [1, 2]로 넣은 것이 문제였다.

저렇게 입력한다고 배열로 들어가는 것이 아니었다.

그래서 그냥 1,2로 넣어주고 service 계층에서 split을 이용해 배열로 만든뒤 반복을 돌려주었다.

 

 

해결

수정된 코드 service 계층

  // 게시글 수정 - img_url 삭제
  deleteImage = async (removeImgIdArray) => {
    await removeImgIdArray.split(',').map( (url_id) => {
      this.postRepository.deleteImage(url_id);
    });
  };

팀원들의 조언을 받아 다른 부분도 약간 수정해 깔끔하게 정리했다.

 

 

 

알게된 것

코드는 눈에 보이는 것보다 많은 정보를 담고 있다.

error를 정확히 파악하고 작은 것부터 차근차근 체크하면 해결할 수 있다!