Question

使用本地Apache Web服务器进行测试，使用Chrome（33）和一段非常基本的代码

function onInitFs(fs) {
    fs.root.getFile("productinfo.xml", {}, function(fileEntry) {
        fileEntry.file(function(file) {
            var reader = new FileReader();
            reader.onloadend = function(e) {
                .
                .
                .
            };
            reader.readAsText(file);
        }, errorHandler);
    }, errorHandler);
}

window.requestFileSystem(window.TEMPORARY, 1024*1024, onInitFs, errorHandler);

无论我把文件放在哪里（productinfo.xml），我都会得到：

在处理操作时找不到请求的文件或目录

我的根目录是C:\xampp\htdocs，因此productinfo.xml应该有效吗？

Answer 1

正如评论所指出的那样，您将要进行AJAX调用 - 如果不从服务器获取该文件，则不会获取该文件。我不确定你是否会坚持每次都进行AJAX调用。但是，使用HTML5-File系统可以防止您每次都重新获取XML。

下面的代码/我的答案是当文件存在时从本地获取文件，当它本地不存在时从服务器获取文件，你的代码看起来如下（或类似的东西） - 我复制并粘贴了大量工作代码并尝试抽象一些组件）：

获取xml文件的函数调用 无论是本地还是服务器，请参阅下面的代码 - 确保在进行以下调用之前初始化fs，这可以通过将其设置为onInitFs中调用的getFile("productinfo.xml",function(textDataFromFile){ console.log("some callback function"} //your ... code should be handled here );中的全局变量来完成。请求文件系统功能

function obtainFileFromServer(filename,callback){
  var xhr2 = new XMLHttpRequest();
  xhr2.onload = function(e){
      writeToFile(filename,xhr2.response,callback);
  }
  xhr2.open('GET', "path/to/"+filename, true);
  xhr2.send();
}

AJAX调用从服务器获取文件

function getFile(filename,callback){
  fs.root.getFile(filename, {create:false}, function(fileEntry) {
    fileEntry.file(function(file) {
      var errorHandler2 = function(e){
      switch(e.name){
        case "NotFoundError":
            //if the productinfo.xml is not found, then go get it from the server
            //In you're callback you'll want to also recall the getFile
            obtainFileFromServer(function(){getFile(filename,callback);});
            break;
        default:
            console.log(e);
            break;
        }
      }
      var reader = new FileReader();
      reader.onloadend = function(e) {
        callback(this.result);
      };
      reader.readAsText(file);
    }, errorHandler2);
  }, errorHandler);
}

从HTML5文件系统中读取。

writeToFile()

写入HTML5文件系统

有两种方法可以查看write方法（function writeToFile(filename,data,callback){ fs.root.getFile(filename, {create: true}, function(fileEntry) { fileEntry.createWriter(function(writer) { writer.onwriteend = function(e) { //we've truncated the file, now write the data writer.onwriteend = function(e){ callback(); } var blob = new Blob([data]); writer.write(blob); }; writer.truncate(0); }, errorHandler); }, errorHandler); }），如果您要替换旧文件，而新的文件恰好更短，您需要在写入之前将其截断（你只能在打开文件后立即截断 - 因此它首先发生）。这似乎超出了这个问题的范围。我要包括截断的代码，但不包括用于确定是否需要重新下载样本的逻辑/如果它是旧的。

{{1}}

找不到文件 - 文件系统API，Javascript

1 个答案:

AJAX调用从服务器获取文件

从HTML5文件系统中读取。

写入HTML5文件系统