How to read the content of an uploaded text file in javascript
Posted on December 22, 2021
Let's suppose you have a file input button:
<input id="upload" type="file"accept="text/*" />
And here the handler to listen for change:
document.querySelector('#upload').addEventListener('input', function() {
// do something
})
Then, we grab the uploaded file reference and read its content using FileReader class:
document.querySelector('#upload').addEventListener('input', function() {
const file = this.files[0]
let fr = new FileReader()
fr.readAsText(file)
fr.onload = () => {
console.log(fr.result)
}
fr.onerror = () => {
console.log(fr.error)
}
})
That's it!