将多个变量传递给内容脚本 chrome

我正在编写我的第一个 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 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 http://developer.chrome.com/extensions/messaging.html，但我希望有一个更高效/可扩展/优雅的解决方案）

任何意见表示赞赏！

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

另一个（我认为更好的）解决方案是chrome.storageAPI（参见http://developer.chrome.com/extensions/storage.html http://developer.chrome.com/extensions/storage.html了解更多信息）。存储 API 可以直接在后台页面和内容脚本中使用，如果您将值存储在 Chrome 中，Chrome 会自动同步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'];
});