Failed to execute 'readAsDataURL' on 'FileReader': parameter 1 is not of type 'Blob

Input을 통해 이미지를 업로드하는 과정에서, 발생되는 오류이다.

 

이미지가 정상적으로 업로드가 된다면 문제가 없으나, 이미지를 선택하는 창 까지  띄운 상태에서 취소하게 되는 경우

이미지 파일 업로드 input에 걸려 있는 함수는 그대로 작동을 하게 되나, 실제 파일이 없어서 발생하는 에러이다.

 

즉, 코드를 실행시에 조건을 아래와 같은 조건을 걸어준다면 문제가 없다.

• 파일이 있는지 확인한다.
• 이미지 파일인지 확인한다.

var file = e.target.files[0];
var reader = new FileReader();

// 기존
reader.readAsDataURL(file);


// 수정
if (file && file.type.match('image.*')) {
	reader.readAsDataURL(file);
}