“文件 API:目录和系统”出现问题在谷歌浏览器中
阅读了关于在 Google Chrome 中使用 HTML5 文件系统 API 的这篇文章后,我决定尝试一下将其合并到打包的 Web 应用程序中。
使用注释和提供的代码作为指导,我整理了一个相当冗长的脚本,如下所示:
var FSA = FSA || {};
var fsys, root, fileReader, dropReader, dropContainer, btn = [];
window.addEventListener("load", function () {
window.requestFileSystem(PERSISTENT, 5242880 /* ~5MB */, function(fs) {
fsys = fs;
root = fsys.root;
}, FSA.error);
});
function createFile(path) {
root.getFile(path, {create:true, exclusive:true}, function() {
console.log(path+ " file created");
}, FSA.error);
};
function saveFile(name, data, mimetype) {
var e = this || null;
name = name || e.target.name;
data = data || e.target.result;
mimetype = mimetype || e.target.type;
root.getFile(name, {create: true}, function(fileEntry) {
fileEntry.createWriter(function(writer) {
writer.onwrite = function(e) {
console.log(name + ' written successfully to filesystem.');
FSA.getFile(name);
};
writer.onerror = function(e) {
console.log('Write failed: ' + e);
};
var bb = new BlobBuilder();
bb.append(data);
writer.write(bb.getBlob(mimetype));
});
}, FSA.error);
};
function openFile(file, fileTarget) {
root.getFile(file.name, null, function(entry) {
entry.file(function(file) {
reader = new FileReader();
reader.filename = file.name;
reader.onload = function(e) {
fileTarget = e.target.result;
};
reader.readAsText(file);
}, FSA.error);
}, FSA.error);
};
而且,在某种程度上,它似乎有效。我可以使用 createFile 函数来创建文件,并且可以使用 saveFile 函数来保存文件。但是,我似乎无法使用 openFile 函数,并且所有三个函数都在 JavaScript 控制台中返回以下错误:
Uncaught TypeError: Cannot call method 'getFile' of undefined
我相信问题与变量 root
有关,但我可能是错的。
由于这是一个新的 API,而且还是一个规范草案,因此可用于帮助解决此问题的文档非常少。
有人能够指出问题,如果是的话,提供解决方案吗?
感谢您的帮助。
编辑:我正在使用“10.0.639.0 canary build”,所以我相信我的浏览器应该允许在扩展中使用该 API。
Having read this article on using the HTML5 File System API in Google Chrome, I decided to have a go at incorporating it into a packaged web application.
Using the notes and supplied code as a guide, I've put together a rather lengthy script as follows:
var FSA = FSA || {};
var fsys, root, fileReader, dropReader, dropContainer, btn = [];
window.addEventListener("load", function () {
window.requestFileSystem(PERSISTENT, 5242880 /* ~5MB */, function(fs) {
fsys = fs;
root = fsys.root;
}, FSA.error);
});
function createFile(path) {
root.getFile(path, {create:true, exclusive:true}, function() {
console.log(path+ " file created");
}, FSA.error);
};
function saveFile(name, data, mimetype) {
var e = this || null;
name = name || e.target.name;
data = data || e.target.result;
mimetype = mimetype || e.target.type;
root.getFile(name, {create: true}, function(fileEntry) {
fileEntry.createWriter(function(writer) {
writer.onwrite = function(e) {
console.log(name + ' written successfully to filesystem.');
FSA.getFile(name);
};
writer.onerror = function(e) {
console.log('Write failed: ' + e);
};
var bb = new BlobBuilder();
bb.append(data);
writer.write(bb.getBlob(mimetype));
});
}, FSA.error);
};
function openFile(file, fileTarget) {
root.getFile(file.name, null, function(entry) {
entry.file(function(file) {
reader = new FileReader();
reader.filename = file.name;
reader.onload = function(e) {
fileTarget = e.target.result;
};
reader.readAsText(file);
}, FSA.error);
}, FSA.error);
};
And, to an extent, it seems to work. I can use the createFile function to create a file, and I can use the saveFile function to save a file. I cannot, however, seem to use the openFile function, and all three functions return the following error in the JavaScript console:
Uncaught TypeError: Cannot call method 'getFile' of undefined
I believe the problem has to do with the variable root
, but I may be wrong.
As this is a new API, and a draft spec at that, there's very little documentation available to help solve this issue.
Would anyone be able to point out the problem(s), and, if so, contribute a solution?
Thanks for your help.
EDIT: I'm using "10.0.639.0 canary build", so I believe that my browser should allow the API to be used in extensions.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
目前,FileSystem API
getFile
无法在任何 Chrome 8 上的扩展中工作。如果您想使用 getFile 创建新文件,则需要在外部托管的网页中运行代码。Chrome 9+ 的扩展程序将支持它。有关详细信息,请参阅 HTML5 Chromium 邮件列表发布。
我正在运行 Google Chrome 10.0.634.0 开发频道。在检查员内:
返回:
For now, the FileSystem API
getFile
does not work in extension on any Chrome 8. You will need to run to run the code in a web page hosted externally if you want to create new files with getFile.It will be supported in Chrome 9+ within Extensions. For more information read the HTML5 Chromium mailing list post.
I am running Google Chrome 10.0.634.0 Dev Channel. And within the inspector:
Returns: