6

我正在编写我的第一个 chrome 扩展程序，几个小时前我才开始这样做。当它被硬编码时，一切都运行良好。本质上，我正在填写一份 8 页的表格。表单的每一页对应一个单独的内容脚本。内容脚本过去看起来像这样：（查找字段有点困难，因为它们不是标准的，但我并不担心......那部分有效）

var first_name = 'John';
var last_name = 'Doe';
...
...
document.getElementById('first_name').value = first_name;
document.getElementById('last_name').value = last_name;

这很好用（对我来说），但我想将它分发给几个人，他们都不会/可以使用源代码中的扩展，直接编辑变量。所以我做了一个“选项”页面，以此为例： https ://developer.chrome.com/trunk/extensions/options.html

选项页面是要填写的表格的模型，每个用户都可以在这里输入他们的默认值。我的 save_options() 函数基本上可以（伪代码）：

foreach(fields as field) {
    localStorage[field] = document.getElement....(field);
}

这工作正常。它可以正确保存，显示存储的值等。

当我尝试从内容脚本访问变量时，问题就来了。根据我的阅读，这不能（直接）完成，网上有各种方法可以展示如何做到这一点。我想做这样的事情（内容脚本）：

var first_name = localStorage["first_name"];
var last_name = localStorage["last_name"];
...
...
document.getElementById('first_name').value = first_name;
document.getElementById('last_name').value = last_name;

我的问题是：

1) 对于那些处理过 Chrome 扩展/localstorage/chrome.storage/etc 的人，有没有“最好”的方法来做到这一点？

2) 设置所有变量名称/值的最有效方法是什么？我更喜欢循环（如上）而不是使用单独的请求设置每个字段。我平均每页10个字段。

（我可能会使用一个冗长、凌乱的http://developer.chrome.com/extensions/messaging.html形式，但我希望有一个更高效/可扩展/优雅的解决方案）

任何输入表示赞赏！

4

1 回答 1

8

一种解决方案是使用您提到的消息传递。

另一个（我认为更好）解决方案是chrome.storageAPI（有关更多信息，请参见http://developer.chrome.com/extensions/storage.html）。Storage API 可以直接在后台页面和内容脚本中使用，如果您将值存储在chrome.storage.sync. 与 localStorage 的唯一实质性区别是此 API 是异步的，因此您必须编写类似的代码

chrome.storage.sync.get(['first_name', 'last_name'], function(items){
    document.getElementById('first_name').value = items['first_name'];
    document.getElementById('last_name').value = items['last_name'];
});
于 2012-12-10T05:33:37.270 回答