Reading Files with FileReader
Read selected files as text or data URLs.
What Is FileReader?
FileReader is a browser API that reads the contents of File and Blob objects asynchronously. You get a file from an <input type="file"> and read it into text, a data URL, or binary.
Getting a File From Input
A file input exposes a files list. The first selected file is at index 0, with useful properties like name, size, and type.
const input = document.querySelector('#picker');
const file = input.files[0];
console.log(file.name);
console.log(file.size);
console.log(file.type);All lessons in this course
- The FormData Object
- Reading Files with FileReader
- Blobs and Object URLs
- Uploading Files with Fetch