Introducing the File API

The HTML5 File API allows us to read files into memory in the browser with the file input control

Good job! That's it for "Introducing the File API."

Need a second look? Watch again

Introducing the File API

The HTML5 File API allows us to read files into memory in the browser with the file input control. In this episode we'll explore the File and FileReader objects to see how to asynchronously read multiple files into various formats in the browser.

  • Meteor
  • Tutorial
<p class="code-block-title">app.js</p> ```javascript Template.fileUpload.events({ // Handle the form submit event "submit form": function (e, tmpl) { var fileInput = tmpl.find('input[type=file]'); // grab a list of the files selected with the file chooser // input var fileList = fileInput.files; // let's not actually submit the form e.preventDefault(); for (var i = 0; i < fileList.length; i++) { // for each file call the read method on our custom // file reader object BinaryFileReader.read(fileList[i], function (err, fileInfo) { if (err) console.log(err); else console.log(fileInfo); }); } } }); ```
Join the Discussion

Want to leave a comment? .