我正在开发Chrome扩展程序,我需要存储一些数据,然后在某个时候获取它。我对 available 进行了调查,storage并发现了以下内容:window.localStorage和chrome.storage.local。
storage
window.localStorage
chrome.storage.local
所以我的问题是,在Chrome扩展程序中使用哪个是正确的选择: window.localStorage 还是 chrome.storage.local ?
PS 我使用browser action加载本地HTML在IFRAME。所以我没有用popup.js。
browser action
HTML
IFRAME
popup.js
这完全取决于您的Chrome扩展程序将要执行的操作。window.localStorage是HTML5存储。除非您在后台页面中运行它,否则它只能允许您获取数据并将其设置到特定域的存储中。对于注入到DOM中的代码也是如此,因为它将使用网页上的localStorage。
换句话说, 除非您在后台页面中使用localStorage,否则 您将无法在不同的网页上共享数据 ,因为该后台存储独立于网页,因为它的域为chrome:// URI。
chrome.storage.local是专为Chrome扩展程序和Chrome应用设计的,用于将数据存储在更中央的位置。由于普通网页无法访问此扩展,因此每个扩展都拥有自己的存储空间。一种可能性是背景页面处理数据的设置和获取,而内容脚本处理网页的修改和交互。
但是,这些API也在内容脚本中起作用,并且我编写的两个扩展都使用从内容脚本中调用的chrome.storage.local。
作为示例,我构建了一个Stack App,该应用程序将Stack Exchange中的收件箱项保留到您实际阅读它们之前,称为StackInbox。由于Stack Exchange网站跨越数百个域,因此我选择了chrome.storage.local,因为我可以保存用户的accountId并在所有站点之间重用它,以确保收件箱数据同步,同时也可以直接在内容脚本中使用它。
作为一个简单的测试,将一些数据放在内容脚本的一个域中的localStorage中,然后尝试将其从另一个域中拉出,您将看到数据将不存在。使用chrome.storage.local,这不是问题。
最后,由于用户选择安装Chrome扩展程序和Chrome应用,因此将其列入了白名单,因此它们通常可以比普通网站执行更多操作。例如,通过在清单中指定“ unlimitedStorage”权限,您可以存储远远超出HTML5 localStorage设置的5MB限制的数据。