我正在编写一个基于 html 的应用程序,并希望从本地文件中存储和检索数据。此应用程序不会托管在 Web 服务器上。
任何人都可以帮助启发主题如何做到这一点?
我正在编写一个基于 html 的应用程序,并希望从本地文件中存储和检索数据。此应用程序不会托管在 Web 服务器上。
任何人都可以帮助启发主题如何做到这一点?
您应该使用 HTML5 的 FileSystem API:
window.requestFileSystem(window.TEMPORARY, 5*1024*1024, function(){
fs.root.getFile('test.dat', {}, function(fileEntry) {
fileEntry.file(function(file) {
// Here is our file object ...
});
});
}, errorHandler);
签出FileSystem API以获取更多参考
访问HTML5 测试以测试浏览器支持
这个问题的答案取决于您对以下问题的回答:
如果您对上述所有问题都回答“是”,那么使用File、FileWriter和FileSystem API,您可以使用 Javascript 从浏览器选项卡/窗口的上下文中写入文件。
怎么样,你问?
烘焙食品*
写入文件:
bakedGoods.set({
data: [{key: "testFile", value: "Hello world!", dataFormat: "text/plain"}],
storageTypes: ["fileSystem"],
options: {fileSystem:{storageType: Window.PERSISTENT}},
complete: function(byStorageTypeStoredItemRangeDataObj, byStorageTypeErrorObj){}
});
读取文件:
bakedGoods.get({
data: ["testFile"],
storageTypes: ["fileSystem"],
options: {fileSystem:{storageType: Window.PERSISTENT}},
complete: function(resultDataObj, byStorageTypeErrorObj){}
});
使用原始 File、FileWriter 和 FileSystem API
写入文件:
function onQuotaRequestSuccess(grantedQuota)
{
function saveFile(directoryEntry)
{
function createFileWriter(fileEntry)
{
function write(fileWriter)
{
var dataBlob = new Blob(["Hello world!"], {type: "text/plain"});
fileWriter.write(dataBlob);
}
fileEntry.createWriter(write);
}
directoryEntry.getFile(
"testFile",
{create: true, exclusive: true},
createFileWriter
);
}
requestFileSystem(Window.PERSISTENT, grantedQuota, saveFile);
}
var desiredQuota = 1024 * 1024 * 1024;
var quotaManagementObj = navigator.webkitPersistentStorage;
quotaManagementObj.requestQuota(desiredQuota, onQuotaRequestSuccess);
读取文件:
function onQuotaRequestSuccess(grantedQuota)
{
function getfile(directoryEntry)
{
function readFile(fileEntry)
{
function read(file)
{
var fileReader = new FileReader();
fileReader.onload = function(){var fileData = fileReader.result};
fileReader.readAsText(file);
}
fileEntry.file(read);
}
directoryEntry.getFile(
"testFile",
{create: false},
readFile
);
}
requestFileSystem(Window.PERSISTENT, grantedQuota, getFile);
}
var desiredQuota = 1024 * 1024 * 1024;
var quotaManagementObj = navigator.webkitPersistentStorage;
quotaManagementObj.requestQuota(desiredQuota, onQuotaRequestSuccess);
但是,如果您在开始时对任何问题回答“否”怎么办?
如果您对非本地解决方案持开放态度,Silverlight 还允许通过独立存储从选项卡/窗口竞赛中进行文件 i/o 。但是,需要托管代码才能使用此功能;需要编写此类代码的解决方案超出了此问题的范围。
当然,使用补充托管代码的解决方案,只留下一个 Javascript 来编写,完全在这个问题的范围内;):
//Write file to first of either FileSystem or IsolatedStorage
bakedGoods.set({
data: [{key: "testFile", value: "Hello world!", dataFormat: "text/plain"}],
storageTypes: ["fileSystem", "silverlight"],
options: {fileSystem:{storageType: Window.PERSISTENT}},
complete: function(byStorageTypeStoredItemRangeDataObj, byStorageTypeErrorObj){}
});
*BakedGoods 由这里的这个人维护 :)
如果(且仅当)您的平台是 IE,您可以利用 HTA(HTML 应用程序)框架:
http://msdn.microsoft.com/en-us/library/ms536471(VS.85).aspx
使用它的应用程序被授予系统级权限,并且可以使用与 Windows 脚本主机相同的对象(例如文件系统对象来读取和访问本地文件)。
我过去曾成功地将它用于小型工作组应用程序并喜欢它——但这是在一个仅限 IE 的企业环境中。