Web/API/FileReader

The FileReader object lets web applications asynchronously read the contents of files (or raw data buffers) stored on the user's computer, using File or Blob objects to specify the file or data to read.

File objects may be obtained from a FileList object returned as a result of a user selecting files using the <input> element, from a drag and drop operation's DataTransfer object, or from the mozGetAsFile() API on an HTMLCanvasElement.

Important note: FileReader is used to read file content from the user's (remote) system in secure ways only. It cannot be used to simply read a file by pathname from a file system. To read files by pathname in JavaScript, standard Ajax solutions should be used to do server-side file reading, with CORS permission if reading cross-domain.

Note: This feature is available in Web Workers.

Constructor

FileReader(): Returns a newly constructed FileReader.

See Using files from web applications for details and examples.

Properties

FileReader.error Read only

A DOMException representing the error that occurred while reading the file.

FileReader.readyState Read only

A number indicating the state of the FileReader. This is one of the following:

`EMPTY`	`0`	No data has been loaded yet.
`LOADING`	`1`	Data is currently being loaded.
`DONE`	`2`	The entire read request has been completed.

FileReader.result Read only

The file's contents. This property is only valid after the read operation is complete, and the format of the data depends on which of the methods was used to initiate the read operation.

Event handlers

FileReader.onabort: A handler for the abort event. This event is triggered each time the reading operation is aborted.
FileReader.onerror: A handler for the error event. This event is triggered each time the reading operation encounter an error.
FileReader.onload: A handler for the load event. This event is triggered each time the reading operation is successfully completed.
FileReader.onloadstart: A handler for the loadstart event. This event is triggered each time the reading is starting.
FileReader.onloadend: A handler for the loadend event. This event is triggered each time the reading operation is completed (either in success or failure).
FileReader.onprogress: A handler for the progress event. This event is triggered while reading a Blob content.

As FileReader inherits from EventTarget, all those events can also be listened for by using the addEventListener method.

Methods

FileReader.abort(): Aborts the read operation. Upon return, the readyState will be DONE.
FileReader.readAsArrayBuffer(): Starts reading the contents of the specified Blob, once finished, the result attribute contains an ArrayBuffer representing the file's data.
FileReader.readAsBinaryString(): Starts reading the contents of the specified Blob, once finished, the result attribute contains the raw binary data from the file as a string.
FileReader.readAsDataURL(): Starts reading the contents of the specified Blob, once finished, the result attribute contains a data: URL representing the file's data.
FileReader.readAsText(): Starts reading the contents of the specified Blob, once finished, the result attribute contains the contents of the file as a text string. An optional encoding name can be specified.

Events

Listen to these events using addEventListener() or by assigning an event listener to the oneventname property of this interface.

abort: Fired when a read has been aborted, for example because the program called FileReader.abort(). Also available via the onabort property.
error: Fired when the read failed due to an error. Also available via the onerror property.
load: Fired when a read has completed successfully. Also available via the onload property.
loadend: Fired when a read has completed, successfully or not. Also available via the onloadend property.
loadstart: Fired when a read has started. Also available via the onloadstart property.
progress: Fired periodically as data is read. Also available via the onprogress property.

Specifications

Specification	Status	Comment
File APIThe definition of 'FileReader' in that specification.	Working Draft	Initial definition

Browser compatibility

Update compatibility data on GitHub

	Desktop						Mobile
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Chrome for Android	Firefox for Android	Opera for Android	Safari on iOS	Samsung Internet
`FileReader`	Chrome Full support 7	Edge Full support 12	Firefox Full support 3.6 Notes' Full support 3.6 Notes' Notes' Prior to Firefox 4, `Blob` parameters were `File` parameters.	IE Full support 10	Opera Full support 11	Safari Full support 6	WebView Android Full support ≤37	Chrome Android Full support 18	Firefox Android Full support 32	Opera Android Full support 11	Safari iOS Full support 6.1	Samsung Internet Android Full support 1.0
`abort`	Chrome Full support 7	Edge Full support 12	Firefox Full support 3.6	IE Full support 10	Opera Full support 11	Safari Full support 6	WebView Android Full support Yes	Chrome Android Full support Yes	Firefox Android Full support 32	Opera Android Full support 11	Safari iOS Full support 6.1	Samsung Internet Android Full support Yes
`abort` event	Chrome Full support Yes	Edge Full support 12	Firefox Full support Yes	IE Full support Yes	Opera Full support Yes	Safari Full support Yes	WebView Android Full support Yes	Chrome Android Full support Yes	Firefox Android Full support Yes	Opera Android Full support Yes	Safari iOS Full support Yes	Samsung Internet Android Full support Yes
`error`	Chrome Full support 7	Edge Full support 12	Firefox Full support 3.6 Notes' Full support 3.6 Notes' Notes' Prior to Firefox 13, the `error` property returned a `FileError` object. Notes' From Firefox 13 to Firefox 58, the `error` property returned a `DOMError` object. Notes' From Firefox 58, the `error` property returns a `DOMException` object.	IE Full support 10 Notes' Full support 10 Notes' Notes' The `error` property returns a `DOMError` object.	Opera Full support 11	Safari Full support 6 Notes' Full support 6 Notes' Notes' The `error` property returns a `DOMError` object.	WebView Android Full support Yes	Chrome Android Full support Yes	Firefox Android Full support 32 Notes' Full support 32 Notes' Notes' From Firefox 32 to Firefox 58, the `error` property returned a `DOMError` object. Notes' From Firefox 58, the `error` property returns a `DOMException` object.	Opera Android Full support 11	Safari iOS Full support 6.1 Notes' Full support 6.1 Notes' Notes' The `error` property returns a `DOMError` object.	Samsung Internet Android Full support Yes
`error` event	Chrome Full support Yes	Edge Full support 12	Firefox Full support Yes	IE Full support Yes	Opera Full support Yes	Safari Full support Yes	WebView Android Full support Yes	Chrome Android Full support Yes	Firefox Android Full support Yes	Opera Android Full support Yes	Safari iOS Full support Yes	Samsung Internet Android Full support Yes
`load` event	Chrome Full support Yes	Edge Full support 12	Firefox Full support Yes	IE Full support Yes	Opera Full support Yes	Safari Full support Yes	WebView Android Full support Yes	Chrome Android Full support Yes	Firefox Android Full support Yes	Opera Android Full support Yes	Safari iOS Full support Yes	Samsung Internet Android Full support Yes
`loadend` event	Chrome Full support Yes	Edge Full support 12	Firefox Full support Yes	IE Full support Yes	Opera Full support Yes	Safari Full support Yes	WebView Android Full support Yes	Chrome Android Full support Yes	Firefox Android Full support Yes	Opera Android Full support Yes	Safari iOS Full support Yes	Samsung Internet Android Full support Yes
`loadstart` event	Chrome Full support Yes	Edge Full support 12	Firefox Full support 79 Full support 79 No support ? — 79 Notes' Notes' `loadstart` event dispatches synchronously (should be asynchronously as per spec).	IE Full support Yes	Opera Full support Yes	Safari Full support Yes	WebView Android Full support Yes	Chrome Android Full support Yes	Firefox Android Full support 79 Full support 79 No support ? — 79 Notes' Notes' `loadstart` event dispatches synchronously (should be asynchronously as per spec).	Opera Android Full support Yes	Safari iOS Full support Yes	Samsung Internet Android Full support Yes
`onabort`	Chrome Full support 7	Edge Full support 12	Firefox Full support 3.6	IE Full support 10	Opera Full support 11	Safari Full support 6	WebView Android Full support Yes	Chrome Android Full support Yes	Firefox Android Full support 32	Opera Android Full support 11	Safari iOS Full support 6.1	Samsung Internet Android Full support Yes
`onerror`	Chrome Full support 7	Edge Full support 12	Firefox Full support 3.6	IE Full support 10	Opera Full support 11	Safari Full support 6	WebView Android Full support Yes	Chrome Android Full support Yes	Firefox Android Full support 32	Opera Android Full support 11	Safari iOS Full support 6.1	Samsung Internet Android Full support Yes
`onload`	Chrome Full support 7	Edge Full support 12	Firefox Full support 3.6	IE Full support 10	Opera Full support 11	Safari Full support 6	WebView Android Full support ≤37	Chrome Android Full support 18	Firefox Android Full support 32	Opera Android Full support 11	Safari iOS Full support 6.1	Samsung Internet Android Full support 1.0
`onloadend`	Chrome Full support 7	Edge Full support 12	Firefox Full support 3.6	IE Full support 10	Opera Full support 11	Safari Full support 6	WebView Android Full support Yes	Chrome Android Full support Yes	Firefox Android Full support 32	Opera Android Full support 11	Safari iOS Full support 6.1	Samsung Internet Android Full support Yes
`onprogress`	Chrome Full support 7	Edge Full support 12	Firefox Full support 3.6	IE Full support 10	Opera Full support 11	Safari Full support 6	WebView Android Full support Yes	Chrome Android Full support Yes	Firefox Android Full support 32	Opera Android Full support 11	Safari iOS Full support 6.1	Samsung Internet Android Full support Yes
`progress` event	Chrome Full support Yes	Edge Full support 12	Firefox Full support Yes	IE Full support Yes	Opera Full support Yes	Safari Full support Yes	WebView Android Full support Yes	Chrome Android Full support Yes	Firefox Android Full support Yes	Opera Android Full support Yes	Safari iOS Full support Yes	Samsung Internet Android Full support Yes
`readAsArrayBuffer`	Chrome Full support 7	Edge Full support 12	Firefox Full support 3.6	IE Full support 10	Opera Full support 12	Safari Full support 6	WebView Android Full support ≤37	Chrome Android Full support 18	Firefox Android Full support 32	Opera Android Full support 12	Safari iOS Full support 6.1	Samsung Internet Android Full support 1.0
`readAsBinaryString`	Chrome Full support 7	Edge Full support 12	Firefox Full support 3.6	IE No support No	Opera Full support 11	Safari Full support 6	WebView Android Full support ≤37	Chrome Android Full support 18	Firefox Android Full support 32	Opera Android Full support 11	Safari iOS Full support 6.1	Samsung Internet Android Full support 1.0
`readAsDataURL`	Chrome Full support 7	Edge Full support 12	Firefox Full support 3.6	IE Full support 10	Opera Full support 11	Safari Full support 6	WebView Android Full support ≤37	Chrome Android Full support 18	Firefox Android Full support 32 Notes' Full support 32 Notes' Notes' Using the camera in Android 8.x raises an exception. See bug 1511083.	Opera Android Full support 11	Safari iOS Full support 6.1	Samsung Internet Android Full support 1.0
`readAsText`	Chrome Full support 7	Edge Full support 12	Firefox Full support 3.6	IE Full support 10	Opera Full support 11	Safari Full support 6	WebView Android Full support ≤37	Chrome Android Full support 18	Firefox Android Full support 32	Opera Android Full support 11	Safari iOS Full support 6.1	Samsung Internet Android Full support 1.0
`readyState`	Chrome Full support 7	Edge Full support 12	Firefox Full support 3.6	IE Full support 10	Opera Full support 11	Safari Full support 6	WebView Android Full support Yes	Chrome Android Full support Yes	Firefox Android Full support 32	Opera Android Full support 11	Safari iOS Full support 6.1	Samsung Internet Android Full support Yes
`result`	Chrome Full support 7	Edge Full support 12	Firefox Full support 3.6	IE Full support 10	Opera Full support 11	Safari Full support 6	WebView Android Full support Yes	Chrome Android Full support Yes	Firefox Android Full support 32	Opera Android Full support 11	Safari iOS Full support 6.1	Samsung Internet Android Full support Yes
Available in workers	Chrome Full support Yes	Edge Full support ≤18	Firefox Full support 46	IE No support No	Opera Full support 11	Safari No support No	WebView Android Full support Yes	Chrome Android Full support Yes	Firefox Android Full support 46	Opera Android Full support 11	Safari iOS No support No	Samsung Internet Android Full support Yes

Legend

Full support: Full support
No support: No support
See implementation notes.': See implementation notes.