将 simple-prefs (SDK API) 与外部脚本和 postMessage 一起使用

我正在使用 SDK 开发附加组件的新版本（针对 Gmail），并且需要为我的用户存储一些布尔首选项。为此，我想使用新的“simple-prefs”API。基于Mozilla 文档和这个堆栈溢出问题，我得到了一些东西，但我面临以下问题：

1）我无法将我的首选项更改正确传递到数据中的外部脚本。我需要禁用并重新启用该附加组件才能应用更改。

2) 如何确保首选项直接应用于打开 Gmail 的选项卡。

这是我的 package.json：

{
"name": "Demo", 
"license": "MPL 1.1/GPL 2.0/LGPL 2.1", 
"author": "me", 
...

"preferences": [{
    "type": "bool",
    "name": "option1",
    "value": true,
    "title": "Description Option1"
},
    {
    "type": "bool",
    "name": "option2",
    "value": true,
    "title": "Description Option2"
  }]
}

我的 main.js：

const pageMod = require("page-mod");
const data    = require("self").data;
const prefSet = require("simple-prefs");

// Get the values for options
var option1 = prefSet.prefs.option1;
var option2 = prefSet.prefs.option2;

// Listen for changes
function onPrefChange(prefName) {  prefSet.prefs[prefName];  }

prefSet.on("option1", onPrefChange);
prefSet.on("option2", onPrefChange);

exports.main = function() {
  pageMod.PageMod({ 
  include: ["https://mail.google.com/*","http://mail.google.com/*"],
  contentScriptWhen: 'ready',
  contentScriptFile: [data.url("jquery.js"),data.url("script.js")],
  onAttach: function(worker)
    {
      worker.postMessage(option1);
      worker.postMessage(option2);
     }
 });
}

我的 script.js （在数据中）：

(function(){

// Option 1
self.on("message", function(option1)    { 
  if( option1 == true ) {  
           // Do this
                          }});

// Option 2
self.on("message", function(option2)    { 
  if( option2 == true ) {  
           // Do this
                          }});
})();

当然有一种更简洁的方法可以在我的 main.js 文件中使用 postMessage 协议并在我的 script.js 文件中调用它...请随意提出您的想法和建议！

您需要设置首选项更改处理程序在 onAttach 处理程序中，因为它是代码中唯一可以访问 prefSet 全局和给定页面的工作实例的位置。这个模式对我有用：

const pageMod = require("page-mod");
const data    = require("self").data;
const prefSet = require("simple-prefs");

// Listen for changes
exports.main = function() {
    pageMod.PageMod({ 
        include: ["*"],
        contentScriptWhen: 'end',
        contentScript: 'self.port.on("prefchange", function(data) { console.log(JSON.stringify(data,null,"  ")); })',
        onAttach: function(worker) {
            function onPrefChange(prefName) {
                worker.port.emit('prefchange', [prefName, prefSet.prefs[prefName]]);
            }

            prefSet.on("option1", onPrefChange);
            prefSet.on("option2", onPrefChange);
        }
    });
}

请参阅此 github 存储库以获取工作示例：https://github.com/canuckistani/Pref-changes