[javaScript] FileReader 객체

FileReader객체는 웹 애플리케이션이 비동기적으로 데이터를 읽기 위하여 읽을 파일을 가리키는 File  혹은 Blob 객체를 이용해 파일의 내용( 또는 raw data 버퍼 )을 읽고 사용자의 컴퓨터에 저장하는 것을 가능하게 해줍니다. 

---

 

생성자

FileReader()  : 새롭게 생성된 FileReader를 반환합니다. 


let reader = new FileReader();

 

속성

FileReader.error : 읽기 전용 DOMError 파일을 읽는 도중 발생한 에러를 나타냅니다.

FileReader.readyState : 읽기 전용 FileReader의 상태를 나타내는 숫자입니다. 

상태 값
EMPTY : 0 : 아직 데이터가 로드되지 않았음
LOADING : 1 : 데이터가 로딩중
DONE  : 2 : 모든 읽기 요청이 완료됨

FileReader.result : 읽기 전용파일의 컨텐츠입니다. 이 속성은 읽기 작업이 완료되고, 읽기 작업의 데이터의 포맷이 정해진 후에 유효합니다. 

 

 

이벤트 핸들러

FileReader.onabortabort : 이 이벤트는 읽기 동작이 중단 될 때마다 발생합니다.

FileReader.onerrorerror : 이 이벤트는 읽기 동작에 에러가 생길 때마다 발생합니다.

FileReader.onloadload : 이벤트는 읽기 동작이 성공적으로 완료 되었을 때마다 발생합니다.

FileReader.onloadstartloadstart : 이 이벤트는 읽기 동작이 실행 될 때마다 발생합니다.

FileReader.onloadendloadend : 이 이벤트는 읽기 동작이 끝났을 때마다 발생합니다. (읽기의 성공이나 실패 여부는 상관 않습니다.)

FileReader.onprogressprogress :  이 이벤트는 Blob 컨텐트를 읽는 동안 호출됩니다.

 

메서드

FileReader.abort() : 읽기 요청을 중단시킵니다. 리턴이 되면 readyState 는 DONE이 됩니다.

FileReader.readAsArrayBuffer() : 지정된의 내용을 읽기 시작합니다. Blob완료되면 result속성 ArrayBuffer에 파일의 데이터를 나타내는 내용이 포함 됩니다.

FileReader.readAsBinaryString() : 지정된의 내용을 읽기 시작합니다. Blob완료되면 result속성에 파일의 원시 이진 데이터가 문자열로 포함됩니다.

FileReader.readAsDataURL() : 지정된의 내용을 읽기 시작합니다. Blob완료되면 result속성 data:에 파일 데이터를 나타내는 URL이 포함 됩니다.

FileReader.readAsText() : 지정된의 내용을 읽기 시작합니다. Blob완료되면 result속성에 파일의 내용이 텍스트 문자열로 포함됩니다.

 

 

예제