Non-standard
This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. There may also be large incompatibilities between implementations and the behavior may change in the future.
The LocalFileSystem
interface of the File System API gives you access to a sandboxed file system. The methods are implemented by window and worker objects.
About this document
This document was last updated on March 14, 2012 and follows the W3C Specifications (Working Draft) drafted on April 19, 2011.
The specification is more or less abandonned, failing to get enough traction.
Basic concepts
This section includes a few key concepts for the methods.
Creating new storage
You request access to a sandboxed file system by calling window.requestFileSystem().
The argument of a successful callback is the FileSystem
object, which has two properties: the name and root of the file system.
You can call the method more than once if you want to create two file systems: one that's temporary and one that's persistent. (To learn more about the storage types, see the Basic Concepts article.) In most cases, you need to create only one file system, but in a few cases, it might be useful to create a second one. For example, if you were to create a mail app, you might create a temporary storage for caching assets (like images and attachments) to speed up performance, while creating persistent storage for unique data—such as drafts of emails that were composed while offline—that should not be lost before they are backed up into the cloud.
Using persistent storage
The requestFileSystem()
method lets you ask for PERSISTENT
or TEMPORARY
storage. Persistent storage is storage that stays in the browser unless the app or the user removes it, but the user must grant you permission before you can use it. In contrast, temporary storage is automatically granted without any user permission, but it can be expunged by the browser at any time.
To use PERSISTENT
storage with the File System API, Chrome exposes a requestQuota API. So to request storage, you need to do something like the following:
var requestedBytes = 1024*1024*10; // 10MB navigator.webkitPersistentStorage.requestQuota ( requestedBytes, function(grantedBytes) { window.requestFileSystem(PERSISTENT, grantedBytes, onInitFs, errorHandler); }, function(e) { console.log('Error', e); } );
Your user must grant your app permission to store data locally before your app can use persistent storage. Once your user grants it, you don't need to call requestQuota()
again. Subsequent calls are a noop.
Another API, the Quota Management API, lets you query an origin's current quota usage and allocation using window.webkitPersistentStorage.queryUsageAndQuota()
. To learn more, see this StackOverflow Answer. (An older version of the API is described at Managing HTML5 Offline Storage.)
Working within a single origin
The file system is sandboxed to a single origin. This means that your app cannot read, or write the files of another app's files. Your app cannot access files in an arbitrary folder (such as, My Pictures, My Documents) on the user's hard drive either. For more information about restrictions, see the Basic Concepts article.
Example
The following is a code snippet that shows how you can request a file system storage.
//Taking care of the browser-specific prefix window.requestFileSystem = window.requestFileSystem || window.webkitRequestFileSystem; // The first parameter defines the type of storage: persistent or temporary // Next, set the size of space needed (in bytes) // initFs is the success callback // And the last one is the error callback // for denial of access and other errors. window.requestFileSystem(window.PERSISTENT, 1024*1024,onInitFs,errorHandler);
Method overview
void requestFileSystem (in unsigned short type, in unsigned long long size, in FileSystemCallback successCallback, in optional ErrorCallback errorCallback); |
void resolveLocalFileSystemURL (in DOMString url, in EntryCallback successCallback, in optional ErrorCallback errorCallback); |
Constants
Constant | Value | Description |
---|---|---|
TEMPORARY |
0 |
Transient storage that can be be removed by the browser at its discretion. |
PERSISTENT |
1 |
Storage that stays in the browser unless the user or the app expunges it. The user must grant permission before the app can use this type of storage. |
Methods
requestFileSystem()
Requests a file system where data should be stored. You access a sandboxed file system by requesting a LocalFileSystem
object using this global method, window.requestFileSystem()
.
void requestFileSystem( in unsigned short type, in unsigned long long size, in FileSystemCallback successCallback, in ErrorCallback errorCallback );
Parameters
- type
- The storage type of the file system. The values can be either
TEMPORARY
orPERSISTENT
. - size
- The storage space—in bytes—that you need for your app.
- successCallback
- The success callback that is called when the browser provides a file system. Its argument is the
FileSystem
object with two properties:- name - the unique name assigned by the browser to the file system.
- root - the read-only
DirectoryEntry
object representing the root of the file system.
- opt_errorCallback
- The error callback that is called when errors happen or when the request to obtain the file system is denied. Its argument is the
FileError
object.
Returns
void
Exceptions
This method can raise an FileError with the following code:
Exception | Description |
---|---|
SECURITY_ERROR |
The application does not have permission to access the file system interface. For example, you cannot run from file:// . For more details, see the article on basic concepts. |
resolveLocalFileSystemURL()
Lets you look up the entry for a file or directory with a local URL.
void resolveLocalFileSystemURL( in DOMString url, in EntryCallback successCallback, in optional ErrorCallback errorCallback );
Parameters
- url
- The URL of a local file in the file system.
- successCallback
- The success callback that is called when the browser provides the file or directory for the supplied URL.
- errorCallback
- The error callback that is called when errors happen or when the request to obtain the entry object is denied.
Returns
void
Exceptions
This method can raise an FileError with the following code:
Exception | Description |
---|---|
ENCODING_ERR |
The syntax of the URL was invalid. |
NOT_FOUND_ERR |
The URL was structurally correct, but refers to a resource that does not exist. |
SECURITY_ERR |
The application does not have permission to access the file system interface. |
Browser compatibility
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
---|---|---|---|---|---|
Basic support | 13webkit | No support | No support | Yes | No support |
Feature | Android | Chrome for Android | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|
Basic support | No support | 0.16 webkit | No support | No support | No support | No support |
See also
Specification:File API: Directories and System SpecificationWD
Reference: File System API
Introduction: Basic Concepts About the File System API