将本地存储还原到本地文件

时间:2014-06-17 12:21:14

标签: javascript jquery html5

有没有办法在jquery或JavaScript中轻松保存本地存储并将其恢复到文件?

有三种情况:

  1. 使用特定的本地存储进行测试

  2. 在此数据至关重要的某些特定情况下备份本地存储(我们希望保存,以防本地缓存被删除)

  3. 从现有本地存储设置另一个浏览器。

3 个答案:

答案 0 :(得分:7)

我可能会对Nathaniel Johnson的答案作出评论,但我还没有声誉!关于这些方法,这里有一些更简单的函数版本:

function getLocalStorage() {
    return JSON.stringify(localStorage)
}

function writeLocalStorage(data) {
    Object.keys(data).forEach(function(key) { localStorage.setItem(key, data[key])})
}

答案 1 :(得分:6)

保存和检索本地存储的过程分为两部分。

首先,您必须能够以javascript中可管理的形式检索本地存储的内容。由于本地存储是键值对的映射,因此最简单的方法是将本地存储转换为javascript对象。然后获取此对象并将其转换为JSON字符串。您对此字符串的处理取决于您,但我发现让用户将字符串复制到电子邮件中最简单。

function getLocalStorage() {
    var a = {};
    for (var i = 0; i < localStorage.length; i++) {
        var k = localStorage.key(i);
        var v = localStorage.getItem(k);
        a[k] = v;
    }
    var s = JSON.stringify(a);
    return s;
}

当我收到字符串时,我使用以下函数将本地存储转换为本地存储的副本。在通过调用localStorage.clear()

复制数据之前,请务必擦除本地存储空间
function writeLocalStorage(data) {
    var o = JSON.parse(data);
    for (var property in o) {
        if (o.hasOwnProperty(property)) {
            localStorage.setItem(property, o[property]);
        }
    }
}

问题的最后一部分是如何保护数据不被覆盖。您无法写入本地文件,但是,您可以将数据复制到<textarea>并告诉用户如何将数据复制并粘贴到电子邮件或more direct approach中。

答案 2 :(得分:1)

下面的这个 javascript 对我有用:

function getLocalstorageToFile(fileName) {
  
  /* dump local storage to string */
  
  var a = {};
  for (var i = 0; i < localStorage.length; i++) {
    var k = localStorage.key(i);
    var v = localStorage.getItem(k);
    a[k] = v;
  }
  
  /* save as blob */
  
  var textToSave = JSON.stringify(a)
  var textToSaveAsBlob = new Blob([textToSave], {
    type: "text/plain"
  });
  var textToSaveAsURL = window.URL.createObjectURL(textToSaveAsBlob);
  
  /* download without button hack */
  
  var downloadLink = document.createElement("a");
  downloadLink.download = fileName;
  downloadLink.innerHTML = "Download File";
  downloadLink.href = textToSaveAsURL;
  downloadLink.onclick = function () {
    document.body.removeChild(event.target);
  };
  downloadLink.style.display = "none";
  document.body.appendChild(downloadLink);
  downloadLink.click();
  
}