我正在通过Chrome App教程,并尝试使用文件系统API保存文件。
据我了解说明,我应该能够打开并读取文件,然后使用同一文件列表创建一个可写的fileentry对象并替换文件内容。
我能够选择和读取文件内容,并且覆盖物似乎几乎是工作。控制台输出使我相信文件是编写的,但内容实际上并没有改变。这是我的代码和输出;
subtest.json ;
{
"manifest_version": 2,
"name": "angular toots",
"version": "1",
"icons": { "128": "icon_128.png" },
"app": { "background": { "scripts": ["background.js"] } },
"permissions": [{"fileSystem": ["write", "retainEntries", "directory"]}],
"minimum_chrome_version": "28"
}
index.html ;
<body ng-app="myApp" ng-controller="appCtrl" >
<div>
<form name="fileForm">
<button ng-click="onLoad()">Load</button>
<button ng-click="onSave()">Save</button>
</form>
</div>
</body>
app.js ;
var app = angular.module('myApp', []);
app.controller('appCtrl', function($scope) {
$scope.chosenFileEntry = null;
$scope.onLoad = function(e) {
chrome.fileSystem.chooseEntry({type: 'openFile'}, function(fileEntry) {
$scope.chosenFileEntry = fileEntry;
console.log($scope.chosenFileEntry);
fileEntry.file(function(file) {
var reader = new FileReader();
reader.onerror = function(e){console.log('error 1');};
reader.onloadend = function(loadEvent) {
console.log(loadEvent.target.result);
};
reader.readAsText(file);
}, function(e){console.log('error 2');});
});
};
$scope.onSave = function(e){
console.log('onSave');
console.log($scope.chosenFileEntry);
chrome.fileSystem.getWritableEntry($scope.chosenFileEntry, function(writableFileEntry) {
writableFileEntry.createWriter(function(writer) {
writer.onerror = function(e){console.log('error 1');};
writer.onwriteend = function(e){console.log('written');};
console.log('writing');
$scope.chosenFileEntry.file(function(file) {
writer.write(file);
});
}, function(e){console.log('error 2');});
});
};
});
C: USER Rooster Rooster desktop foo.txt
Some Text
单击加载时,保存,我将其放入控制台;
> FileEntry {isFile: true, isDirectory: false, name: "foo.txt", fullPath: "/foo.txt", filesystem: DOMFileSystem}
Some Text
onSave
> FileEntry {isFile: true, isDirectory: false, name: "foo.txt", fullPath: "/foo.txt", filesystem: DOMFileSystem}
writing
written
但是,目标文件的内容不变。
我确实注意到fileentry fullPath 属性并不是文件的完整路径。尝试修改该属性似乎没有任何效果,即无法更改。
我缺少什么?
您需要使用chrome.fileSystem API
。您需要至少询问用户一次保存文件,但是您可以保留条目以再次写入同一文件/文件夹。
使用chrome.fileSystem.chooseEntry({'type': "openDirectory"})
提出提示,要求用户选择一个目录,但是我找不到保存到该目录的方法。
声明fileSystem API
的权限:
"permissions": [
{"fileSystem": ["write", "retainEntries", "directory"]}
]
然后,通过使用HTML文件系统API,您可以在目录中创建文件:
dirEntry.getFile(
"test.txt",
{create: true}, // add "exclusive: true" to prevent overwrite
function(fileEntry) { /* write here */ },
function(e) { console.error(e) }
);