using the html5 filesystem api,HTML5 FileSystem API 测试（一）

参考书 Using the HTML5 Filesystem API.pdf

用Chrome打开网站： www.baidu.com

打开其JavaScrip控制台，输入此js(以后称脚本一)查看当前本地存储使用状况:

window.webkitStorageInfo.queryUsageAndQuota(TEMPORARY, function(usage, quota) {

console.log('Using: ' + (usage / quota) * 100 + '% of temporary storage');

}, function(e) {

console.log('Error', e);

});

接着执行

var fileEn;

function onFs(fs) {

fs.root.getFile('log.txt', {create: true, exclusive: true},

function(fileEntry) {

// fileEntry.isFile === true

// fileEntry.name == 'log.txt'

// fileEntry.fullPath == '/log.txt'

fileEn=fileEntry;

console.log('FileEntry Name: ' + fileEntry.name);

console.log('FileEntry FullPath: ' + fileEntry.fullPath);

//fileEntry.getMetaData(function(md) {

// console.log(md.modificationTime.toDateString());

//}, onError);

},

onError

);

}

//FileError constants

function onError(err) {

var msg = 'Error: ';

switch (err.code) {

case FileError.NOT_FOUND_ERR:

msg += 'File or directory not found';

break;

case FileError.SECURITY_ERR:

msg += 'Insecure or disallowed operation';

break;

case FileError.ABORT_ERR:

msg += 'Operation aborted';

break;

case FileError.NOT_READABLE_ERR:

msg += 'File or directory not readable';

break;

case FileError.ENCODING_ERR:

msg += 'Invalid encoding';

break;

case FileError.NO_MODIFICATION_ALLOWED_ERR:

msg += 'Cannot modify file or directory';

break;

case FileError.INVALID_STATE_ERR:

msg += 'Invalid state';

break;

case FileError.SYNTAX_ERR:

msg += 'Invalid line-ending specifier';

break;

case FileError.INVALID_MODIFICATION_ERR:

msg += 'Invalid modification';

break;

case FileError.QUOTA_EXCEEDED_ERR:

msg += 'Storage quota exceeded';

break;

case FileError.TYPE_MISMATCH_ERR:

msg += 'Invalid filetype';

break;

case FileError.PATH_EXISTS_ERR:

msg += 'File or directory already exists at specified path';

break;

default:

msg += 'Unknown Error';

break;

};

console.log(msg);

}

window.webkitRequestFileSystem(TEMPORARY, 2*1024*1024 /*2MB*/, onFs, onError);

之后执行下列代码和

脚本一

console.dir(fileEn);

运行截图如下：

写入文件数据测试

var writeToFile=function(fileEntry) {

// Create a FileWriter object for our FileEntry.

fileEntry.createWriter(function(fileWriter) {

fileWriter.onwrite = function(e) {

console.log('Write completed.');

};

fileWriter.onerror = function(e) {

console.log('Write failed: ' + e.toString());

};

var bb = new WebKitBlobBuilder(); // Create a new Blob on-the-fly.

bb.append('Lorem Ipsum');

fileWriter.write(bb.getBlob('text/plain'));

}, onError);

}

输入

脚本一会发现占用的空间发生变化

读取文件

var reader;

var readFromFile=function(fileEntry) {

// Obtain the File object representing the FileEntry.

// Use FileReader to read its contents.

fileEntry.file(function(file) {

reader = new FileReader();

reader.readAsText(file); // Read the file as plaintext.

console.log(reader.result);

}, onError);

}

执行查看reader对象情况

console.dir(reader)