[error] Failed to execute 'readAsDataURL' on 'FileReader': parameter 1 is not of type 'Blob'.

input 을 통해 이미지를 업로드를 하는 과정에서, 발생 되는 오류이다
이미지를 정상적으로 업로드 한다면 문제가 없으나, 이미지를 선택하는 창 까지 띄운 상태에서 취소를 하게 되는 경우
이미지 파일 업로드 input에 걸려 있는 함수는 그대로 작동을 하게 되나, 실제 파일이 없어서 에러가 발생하게 된다.
확인을 위해 e.target.file 을 체크 해보니, 파일의 업로드 시 e.target.file의 length가 1 업로드를 취소 한 경우 0이 나오게 된다.

기존 코드

reader.readAsDataURL(file);

에 조건문을 달아주었다

 

변경 코드

    if (file) {
      reader.readAsDataURL(file);
    }