如何备份html 5本地存储数据

Question

我使用html5和java脚本库开发一个离线应用程序。我的系统是用于离线数据收集的。数据以文本格式存储在本地计算机中，然后再同步到服务器。以前我开发过相同的应用程序，但使用silver light，出于安全原因，它很容易备份数据，使用

任何关于如何备份文本文件并将其压缩到我的硬盘上的想法都将非常感谢。

到目前为止，通过我的研究，我还没有找到一个可靠的答案，谢谢。

Answer 1

我能想到的一个“解决方案”是，在用户使用close按钮关闭应用程序之前，您可以检测window.onbeforeunload事件并将数据发送到服务器进行保存。但这是不可靠的，因为可能存在浏览器可能崩溃或用户可能强制关闭浏览器应用程序的情况。或者最糟糕的是，如果您经常使用localStorage，而用户偶然清除了浏览数据(包括localStorage)，这些数据就会消失。

但是假设您手头有数据，您可以使用POST将其发送到服务器，并创建一个脚本将其保存在磁盘中。显然，您可能希望对文件大小施加限制，并强制实施其他安全限制。

警告: PHP

假设您为每个唯一的用户创建了一个文件夹，并且保证每个用户的文件夹中的所有文件都被唯一命名。在PHP中，你可以使用像file_put_contents()这样的函数来保存文本文件，你也可以很容易地使用ZipArchive类来压缩它。

不建议将此类数据直接存储到驱动器中。我强烈建议您将localStorage数据放在某种类型的数据库中，并进行数据库备份，而不是备份单个用户的数据。

正如其他用户所指出的，您还可以查看HTML5文件API。示例here。

Answer 2

我找到了一个关于如何备份本地存储文件并将它们压缩到我的本地驱动器上的解决方案，而不需要任何服务器代码。下面是一个代码片段，它对我来说工作得很好，至少现在是这样。任何修改和增强都将受到高度赞赏。

if (localStorageKeys.length > 0) {
    for (var i = 0; i < localStorageKeys.length; i++) {
        var key = localStorageKeys[i];
        if (key.search(_instrumentId) != -1) {
            keysToBackup.push(key);
            var data = localStorage.getItem(localStorageKeys[i]);
            zip.file(localStorageKeys[i].slice(0, -19) + ".txt", data);
        }
        else {
            keysNotToBackup.push(key);
        }
        var datafile = document.getElementById('backupData');
        datafile.download = formName + "_Data.zip";
        datafile.href = window.URL.createObjectURL(zip.generate({ type: "blob" }));

    }
}