保存Chrome扩展程序数据(使用LocalForage)

时间:2016-01-25 22:21:35

标签: javascript google-chrome google-chrome-extension local-storage localforage

我是网络和Chrome扩展程序开发人员的新手,我正在尝试使用localForage API存储我的Chrome扩展程序的数据 - 目前我每次切换到新标签时都会丢失所有内容,但我希望数据保留直到用户明确清除所有内容(即使是多个会话等)

我决定给localForage api一个go(因为它应该像localStorage,但更简单)并且觉得我错过了一些重要的东西 - 我可以setItems / getItems没有问题,但它&#39 ;实际上并没有保存任何数据。

在切换标签(以及多个浏览会话)时,我究竟如何确保数据保持不变?

使用localForage.getItem / setItem-这似乎与使用数据一样有效,但在切换标签时不能保存它

citeUrl(values, function(citation) 
    {
      count++;
      var string = citation[0];
      localforage.setItem(string, [citation[0],citation[1]], function(err, value) 
      {// Do other things once the value has been saved.
        console.log(value[0] + " " + value[1]);
      });
      /*var result = document.getElementById('cite[]');
      result.style.visibility = 'visible'; 
      result.style.display = 'block';
      result.innerHTML = citation[0];
      renderStatus(citation[1]);*/

      for(i = 0; i < count ; i++)
      {
        var newCitation = document.createElement('div');
        localforage.getItem(citation[i], function(err, value)
          {
            newCitation.innerHTML = value[1] + "<br>" + value[0];
          }
        );
        newCitation.style.backgroundColor = "white";
        newCitation.style.marginBottom = "7px";
        newCitation.style.padding = "6px";
        newCitation.style.boxShadow= "0 2px 6px rgba(0,0,0,0.4)";
        newCitation.style.borderRadius = "3px";
        document.getElementById("answered[]").appendChild(newCitation);
      }
    }

1 个答案:

答案 0 :(得分:0)

localForage建立在localStorage和朋友之上。重要的是它与你访问它的起源有关。

从内容脚本中使用它使用网站的来源,例如:使用http://example.com/test上的扩展程序会将数据绑定到http://example.com/来源,并使用http://example2.com/test上的扩展程序将数据绑定到连接到原始http://example2.com/的完全独立的商店。更重要的是,数据与页面自己的存储共享(并可能会干扰)。

因此,使用localStorage(以及扩展名为localForage)不允许在内容脚本中使用预期结果(尽管如果您尝试使用页面自己进行操作,它可能仍然有用存储)。

因此,有两种可能性可以正确地做到:

  1. 如果必须使用它,请在后台脚本中使用localForage。在这种情况下,数据绑定到源chrome-extension://yourextensionidhere。但是,内容脚本无法访问 - 您需要使用Messaging传递数据,这很烦人。

  2. 更好,特定于扩展程序的方法:使用本机chrome.storage API,它在扩展程序的所有部分之间共享。此API专门用于解决需要传递数据限制等问题。

  3. (赢取大量互联网积分方法)使用chrome.storage API撰写custom driver for localForage。这样,人们就可以轻松地在Chrome扩展程序和应用中使用它。显然,something already attempted

  4. This question可能有用。