HTML and CSS Reference
In-Depth Information
1.4.3. File, File Reader, File Writer, and File System APIs
Working with files in web applications has traditionally been a pain. The only native means
of allowing users to select files from their computers was to use the file input type, which
is well known for being cumbersome, particularly when it comes to styling the UI of the
widget. When the user selected the file, the application would have to upload the entire file
to the server in order to do anything with it. Although Flash- and Java-based offerings are
available that provide improved functionality, these aren't ideal given that they require a
third-party plug-in.
The HTML5 family includes a number of related file-based specifications that promise to
make working with files in web applications much easier. The File API allows developers
to get a reference to a file object in JavaScript, reading properties such as its name, size,
and MIME type. You can use the File Reader API to read a file object, either in its en-
tirety or partially in chunks. Similarly, you can use the File Writer API to output data to
a file. The File System API allows developers to manipulate file objects in a sandboxed
local filesystem on the client. This enables you to perform much of the file interaction on
the client, significantly saving the load on the server. No longer do you have to upload the
entire file to the server, only to discover it's of the wrong MIME type, and then have to tell
the user that the file wasn't of the correct type. You can imagine how annoying this would
be to users after they've uploaded a large file.
You'll use all of these APIs to provide a full local filesystem, and we'll cover where HTML
is illustrated in
figure 1.17
.
