1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
|
---
title: FileReader
slug: Web/API/FileReader
tags:
- API
- File API
- Files
- Interface
- Reference
translation_of: Web/API/FileReader
---
<div>{{APIRef("File API")}}</div>
<p><strong><code>FileReader</code></strong> 객체는 웹 애플리케이션이 비동기적으로 데이터를 읽기 위하여 읽을 파일을 가리키는{{ domxref("File") }} 혹은 {{ domxref("Blob") }} 객체를 이용해 파일의 내용을(혹은 raw data버퍼로) 읽고 사용자의 컴퓨터에 저장하는 것을 가능하게 해줍니다.</p>
<p>File 객체는 {{ HTMLElement("input") }} 태그를 이용하여 유저가 선택한 파일들의 결과로 반환된 {{ domxref("FileList") }} 객체, 드래그 앤 드랍으로 반환된 <a href="/En/DragDrop/DataTransfer" title="En/DragDrop/DataTransfer"><code>DataTransfer</code></a> 객체 혹은 {{ domxref("HTMLCanvasElement") }}의 <code style="font-style: normal;">mozGetAsFile()</code> API로 부터 얻습니다.</p>
<h2 id="생성자">생성자</h2>
<dl>
<dt>{{domxref("FileReader.FileReader", "FileReader()")}}</dt>
<dd>Returns a newly constructed <code>FileReader</code>.</dd>
</dl>
<p>See <a href="https://developer.mozilla.org/en-US/docs/Using_files_from_web_applications">Using files from web applications</a> for details and examples.</p>
<h2 id="Properties" name="Properties">속성</h2>
<dl>
<dt>{{domxref("FileReader.error")}} {{readonlyinline}}</dt>
<dd>{{domxref("DOMError")}} 파일을 읽는 도중에 발생한 에러를 나타냅니다.</dd>
<dt>{{domxref("FileReader.readyState")}} {{readonlyinline}}</dt>
<dd><code>FileReader의 상태를 나타내는 숫자입니다</code>.</dd>
<dt>
<h4 id="State_constants" name="State_constants">상태 값들</h4>
<code>EMPTY </code> : <code>0</code> : 아직 데이터가 로드 되지 않았음.</dt>
<dt><code>LOADING</code> : <code>1</code> : 데이터가 로딩 중.</dt>
<dt><code>DONE </code> : <code>2</code> : 모든 읽기 요청이 완료됨.</dt>
<dd> </dd>
<dt>{{domxref("FileReader.result")}} {{readonlyinline}}</dt>
<dd>파일의 컨텐츠입니다. 이 속성은 읽기 작업이 완료되고 읽기 작업의 초기화에 사용한 방식으로 결정된 데이터의 포맷이 정해진 후에 유효합니다.</dd>
</dl>
<h3 id="이벤트_핸들러">이벤트 핸들러</h3>
<dl>
<dt>{{domxref("FileReader.onabort")}}</dt>
<dd>{{event("abort")}} 이벤트의 핸들러. 이 이벤트는 읽기 동작이 중단 될 때마다 발생합니다.</dd>
<dt>{{domxref("FileReader.onerror")}}</dt>
<dd>{{event("error")}} 이벤트의 핸들러. 이 이벤트는 읽기 동작에 에러가 생길 때마다 발생합니다.</dd>
<dt>{{domxref("FileReader.onload")}}</dt>
<dd>{{event("load")}} 이벤트의 핸들러. 이 이벤트는 읽기 동작이 성공적으로 완료 되었을 때마다 발생합니다.</dd>
<dt>{{domxref("FileReader.onloadstart")}}</dt>
<dd>{{event("loadstart")}} 이벤트 핸들러. 이 이벤트는 읽기 동작이 실행 될 때마다 발생합니다.</dd>
<dt>{{domxref("FileReader.onloadend")}}</dt>
<dd>{{event("loadend")}} 이벤트 핸들러. 이 이벤트는 읽기 동작이 끝났을 때마다 발생합니다. (읽기의 성공이나 실패 여부는 상관 않습니다.)</dd>
<dt>{{domxref("FileReader.onprogress")}}</dt>
<dd>{{event("progress")}} 이벤트 핸들러. 이 이벤트는 {{domxref("Blob")}} 컨텐트를 읽는 동안 호출됩니다.</dd>
</dl>
<div class="note">
<p>참고: <code>FileReader</code>는 {{domxref("EventTarget")}} 으로 부터 상속 받았습니다, 언급된 모든 이벤트들은 {{domxref("EventTarget.addEventListener()","addEventListener")}} 메소드를 사용하여 listen 하게 할 수 있습니다.</p>
</div>
<ul>
</ul>
<h2 id="Methods" name="Methods">메서드</h2>
<dl>
<dt>{{domxref("FileReader.abort()")}}</dt>
<dd>읽기 요청을 중단시킵니다. 리턴이 되면 readyState 는 DONE이 됩니다.</dd>
<dt>{{domxref("FileReader.readAsArrayBuffer()")}} {{ gecko_minversion_inline("7.0") }}</dt>
<dd>Starts reading the contents of the specified {{ domxref("Blob") }}, once finished, the <code>result</code> attribute contains an {{domxref("ArrayBuffer")}} representing the file's data.</dd>
<dt>{{domxref("FileReader.readAsBinaryString()")}}</dt>
<dd>Starts reading the contents of the specified {{ domxref("Blob") }}, once finished, the <code>result</code> attribute contains the raw binary data from the file as a string.</dd>
<dt>{{domxref("FileReader.readAsDataURL()")}}</dt>
<dd>Starts reading the contents of the specified {{ domxref("Blob") }}, once finished, the <code>result</code> attribute contains a <code>data:</code> URL representing the file's data.</dd>
<dt>{{domxref("FileReader.readAsText()")}}</dt>
<dd>Starts reading the contents of the specified {{ domxref("Blob") }}, once finished, the <code>result</code> attribute contains the contents of the file as a text string.</dd>
</dl>
<h2 id="명세">명세</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">Specification</th>
<th scope="col">Status</th>
<th scope="col">Comment</th>
</tr>
<tr>
<td>{{SpecName('File API','#FileReader-interface','FileReader')}}</td>
<td>{{Spec2('File API')}}</td>
<td>Initial definition.</td>
</tr>
</tbody>
</table>
<h2 id="Browser_compatibility" name="Browser_compatibility">브라우저 호환성</h2>
<p>{{Compat("api.FileReader")}}</p>
<h2 id="See_also" name="See_also">같이 보기</h2>
<ul>
<li><a href="/en/Using_files_from_web_applications" title="en/Using files from web applications">Using files from web applications</a></li>
<li>{{ domxref("File") }}</li>
<li>{{ domxref("Blob") }}</li>
<li><a href="/en-US/docs/nsIDOMFileReader">nsIDOMFileReader [en-US]</a> - For addons/privelaged scope</li>
</ul>
|
