HTML5文件读写同步

时间:2015-05-01 17:19:36

标签: javascript jquery html5 cordova

我设法设置代码来写入和读取文本文件。 我遇到的问题是我在写完文件后尝试读取文件。 它返回一个空值。 我假设这是由于读取开始时写入不完整。 如何使读取等待写入。

MyFile Class

MyFile = function() {

};

MyFile.prototype.readFile = function(fileDir, fileName) {
    window.resolveLocalFileSystemURL(fileDir, function(dir) {
        dir.getFile(fileName, {create: true}, function(fileEntry) {
            fileEntry.file(function(file) {
                var reader = new FileReader();
                reader.onerror = function(evt) {
                    console.log("Reading " + file.name +  " Failed");
                };
                reader.onloadstart = function(evt) {
                    console.log("Read " + file.name +  " Starting");
                };
                reader.onload = function(evt) {
                    console.log("Read " + file.name +  " Successful");
                    window.localStorage.setItem(file.name + "Read", evt.target.result);
                    console.log(evt.target.result);
                };
                reader.onloadend = function(evt) {
                    console.log("Read " + file.name +  " Ending");
                };
                reader.readAsText(file);
            }, fail);
        }, fail);
    }, fail);
    var strText = window.localStorage.getItem(fileName + "Read");
    console.log(strText);
    window.localStorage.removeItem(fileName + "Read");
    return strText;
};


MyFile.prototype.overWriteFile = function(fileDir, fileName, strText) {
    window.resolveLocalFileSystemURL(fileDir, function(dir) {
        dir.getFile(fileName, {create: true}, function(file) {
            if (!file) {
                return;
            } else {
                console.log("Overwrite File Name: " + file.name);
            }
            file.createWriter(function(fileWriter) {
                fileWriter.onwriteend = function(evt) {
                    if (fileWriter.length === 0) {
                        //fileWriter has been reset, write file
                        fileWriter.write(strText);
                    } else {
                        //file has been overwritten with blob
                        //use callback or resolve promise
                        console.log("Write " + file.name +  " Success");
                        console.log(strText);
                    }
                };
                fileWriter.truncate(0);
            }, fail);
        });
    });
};

调用写入和读取

 var myf = new MyFile();
 myf.overWriteFile("Directory", "test.txt","Test.txt Contents");
 console.log(myf.readFile("Directory", "test.txt"));

1 个答案:

答案 0 :(得分:1)

如果您不介意jQuery,可以尝试使用在文件写完时触发的自定义事件。

MyFile.prototype.overWriteFile = function(fileDir, fileName, strText) {
    //added self var to be accessed from within createWriter finished section
    var self = this

    window.resolveLocalFileSystemURL(fileDir, function(dir) {
        dir.getFile(fileName, {create: true}, function(file) {
            if (!file) {
                return;
            } else {
                console.log("Overwrite File Name: " + file.name);
            }
            file.createWriter(function(fileWriter) {
                fileWriter.onwriteend = function(evt) {
                    if (fileWriter.length === 0) {
                        //fileWriter has been reset, write file
                        fileWriter.write(strText);
                    } else {
                        //file has been overwritten with blob
                        //use callback or resolve promise
                        //triggers the finishedMyFileWrite on the MyFile instance
                        jQuery(self).tigger('finishedMyFileWrite');
                        console.log("Write " + file.name +  " Success");
                        console.log(strText);
                    }
                };
                fileWriter.truncate(0);
            }, fail);
        });
    });
};

var myf = new MyFile();

jQuery(myf).on('finishedMyFileWrite', function finishedWrite(){
    console.log(this.readFile("Directory", "test.txt"));
});

myf.overWriteFile("Directory", "test.txt","Test.txt Contents");

我添加了self变量以允许自定义事件以MyFile的特定实例为目标,然后在文件写入后触发名为finishedMyFileWrite的事件。 myf对象设置为在写入之前侦听此回调。我无法测试这个,因为我没有一个cordova模拟器,但理论应该有用。