Chrome扩展程序：在内容脚本中访问localStorage
所以，我有一个选项页面，用户可以定义某些选项，并将其保存在localStorage： options.html
现在，我还有一个内容脚本需要获取options.html页面中定义的options.html ，但是当我尝试从内容脚本访问localStorage时，它不会从选项页面返回值。
如何让我的内容脚本从localStorage，选项页面甚至背景页面获取值？
2016年更新：
Google Chrome发布了存储API： http ： //developer.chrome.com/extensions/storage.html
与其他Chrome API一样使用起来非常简单，您可以在Chrome中的任何页面环境中使用它。
// Save it using the Chrome extension storage API. chrome.storage.sync.set({'foo': 'hello', 'bar': 'hi'}, function() { console.log('Settings saved'); }); // Read it using the storage API chrome.storage.sync.get(['foo', 'bar'], function(items) { message('Settings retrieved', items); });
要使用它，请确保在清单中定义它：
"permissions": [ "storage" ],
有“删除”，“清除”，“getBytesInUse”和一个事件监听器的方法来侦听已更改的存储“onChanged”
使用本地localStorage（ 2011年的旧回复 ）
内容脚本在网页的上下文中运行，而不是在扩展页面上运行。 因此，如果您从内容中访问localStorage，它将成为该网页的存储空间，而不是扩展页面存储空间。
现在，要让你的内容脚本读取你的扩展存储（你从你的选项页面设置它们），你需要使用扩展消息传递 。
你要做的第一件事是告诉你的内容脚本发送一个请求到你的扩展来获取一些数据，这些数据可以是你的扩展localStorage：
contentscript.js
chrome.runtime.sendMessage({method: "getStatus"}, function(response) { console.log(response.status); });
background.js
chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) { if (request.method == "getStatus") sendResponse({status: localStorage['status']}); else sendResponse({}); // snub them. });
你可以做一个API来获得通用的localStorage数据到你的内容脚本，或者获取整个localStorage数组。
我希望能帮助你解决你的问题。
为了看中和通用…
contentscript.js
chrome.runtime.sendMessage({method: "getLocalStorage", key: "status"}, function(response) { console.log(response.data); });
background.js
chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) { if (request.method == "getLocalStorage") sendResponse({data: localStorage[request.key]}); else sendResponse({}); // snub them. });
有时使用chrome.storage API可能会更好。 这比localStorage更好，因为你可以：
- 从内容脚本存储信息， 而不需要内容脚本和扩展之间的消息传递 ;
- 将数据存储为JavaScript对象，而不将其序列化为JSON（ localStorage仅存储string ）。
这是一个简单的代码，演示了使用chrome.storage。 内容脚本获取访问页面的时间戳和时间戳，并存储它，popup.js从存储区获取它。
content_script.js
(function () { var visited = window.location.href; var time = +new Date(); chrome.storage.sync.set({'visitedPages':{pageUrl:visited,time:time}}, function () { console.log("Just visited",visited) }); })();
popup.js
(function () { chrome.storage.onChanged.addListener(function (changes,areaName) { console.log("New item in storage",changes.visitedPages.newValue); }) })();
这里的“更改”是一个包含给定键的新值和新值的对象。 “AreaName”参数是指存储区域的名称，可以是“本地”，“同步”或“托pipe”。
请记住在manifest.json中声明存储权限。
的manifest.json
... "permissions": [ "storage" ], ...
另一种select是使用chromestorage API。 这允许在跨会话进行可选同步的情况下存储用户数据。
一个缺点是它是asynchronous的。
