FileReader: readAsText() method
Note: This feature is available in Web Workers.
The readAsText()
method of the FileReader
interface is used to read the contents of the specified Blob
or File
.
When the read operation is complete, the readyState
property is changed to DONE
,
the loadend
event is triggered, and the result
property contains the contents of the file as a text string.
Note:
The Blob.text()
method is a newer promise-based API to read a file as text.
Note:
This method loads the entire file's content into memory and is not suitable for large files. Prefer readAsArrayBuffer()
for large files.
Syntax
js
readAsText(blob)
readAsText(blob, encoding)
Parameters
blob
encoding
Optional-
A string specifying the encoding to use for the returned data. By default, UTF-8 is assumed if this parameter is not specified.
Return value
None (undefined
).
Examples
HTML
html
<input type="file" onchange="previewFile()" /><br />
<p class="content"></p>
JavaScript
js
function previewFile() {
const content = document.querySelector(".content");
const [file] = document.querySelector("input[type=file]").files;
const reader = new FileReader();
reader.addEventListener(
"load",
() => {
// this will then display a text file
content.innerText = reader.result;
},
false,
);
if (file) {
reader.readAsText(file);
}
}
Result
Specifications
Specification |
---|
File API # readAsDataText |
Browser compatibility
BCD tables only load in the browser