附加组件生成器：多个工人使用端口？ [英] Add-on Builder: Multiple Workers Using port?

问题描述

引用这个问题：附加构建器：ContentScript并返回到插件代码？

以下是我的插件代码：

  var widget = widgets.Widget（{
 id：addon，
 contentURL：data.url（icon.png），
 onClick：function（）{
 var workers = []; 
 for each （在windows.activeWindow.tabs var选项卡）{
 var worker = tab.attach（{contentScriptFile：[data.url（jquery.js），data.url（myScript.js））}） ; 
 workers.push（worker）; 
} 
} 
}）; 
  

这里是myScript.js：

  var first = $（。avatar：first）; 
 if（first.length！== 0）{
 var url = first.attr（href）; 
 self.port.emit（'got-url'，{url：url}）; 
 
 
 
 
 
 $现在我有多个工作人员，我可以放在哪里
  worker.port.on（'got-url'，function（data）{
 worker.tab.url = data.url; 
}）; 
  
由于在另一个问题中，我只有一个工人，但现在我有一个工人数组。  
 
解决方案
代码如下：
 
 
  // main.js：
 var data = require（self）。data; 
 var windows = require（windows）。browserWindows; Widget（{
 id：addon，
 label：某个标签，
 contentURL：data。）
 
 var widget = require url（favicon.png），
 onClick：function（）{
 // var workers = []; 
（windows.activeWindow.tabs中的var选项卡）{
 
 var worker = tab.attach（{
 contentScriptFile：[data.url（jquery.js），
 data.url（inject.js）] $ b $ （b）}; 
 
 worker.port.on（'got-url'，function（data）{
 console.log（data.url）; 
 // worker。 tab.url = data.url; 
））; 
 
 worker.port.emit（'init'，true）; 
 console.log（got here）; 
 //workers.push (worker）; 
} 
} 
}）; 
 $ b // inject.js 
 $（function（）{
 self.port.on（'init'，function（）{
 console.log（'在init'）; 
 var first = $（。avatar：first）; 
 if（first.length！== 0）{
 var url = first.attr（href ）; 
 console.log（'injected！'）; 
 self.port.emit（'got-url'，{url：url}）; 
} 
} ）; 
}）; 
  
 编辑：对不起，应该有实际运行的代码，在工作者监听器被建立之前内容脚本被注入的定时问题，所以当发出'got-url'事件时监听器还没有被创建。我通过推迟内容脚本中的任何操作来解决这个问题，直到'init'事件发送到内容脚本中为止。
 
 
 
以下是构建器上的一个工作示例：
 
 
 
  https：//builder.addons。 mozilla.org/addon/1045470/latest/  
 
 
 
这个例子的剩余问题是，没有办法确定一个标签是否被注入我们的插件，所以我们将'泄漏'或每次点击小部件时使用更多的内存。更好的方法可能是在加载时使用page-mod注入内容脚本，并且只在小部件的onclick处理函数中发出'init'事件。
Referring to this question: Add-on Builder: ContentScript and back to Addon code?

Here is my addon code:
var widget = widgets.Widget({
  id: "addon",
  contentURL: data.url("icon.png"),
  onClick: function() {
    var workers = [];
    for each (var tab in windows.activeWindow.tabs) {
        var worker = tab.attach({contentScriptFile: [data.url("jquery.js"), data.url("myScript.js")]});
        workers.push(worker);
    }
  }
});
And here is myScript.js:
var first = $(".avatar:first");
if (first.length !== 0) {
    var url = first.attr("href");
    self.port.emit('got-url', {url: url});
}
Now that I have multiple workers where do I put 
worker.port.on('got-url', function(data) {
            worker.tab.url = data.url;
        });
Since in the other question I only had one worker but now I have an array of workers.
解决方案
The code would be:
// main.js:
var data = require("self").data;
var windows = require("windows").browserWindows;

var widget = require("widget").Widget({
    id: "addon",
    label: "Some label",
    contentURL: data.url("favicon.png"),
    onClick: function() {
        //var workers = [];
        for each (var tab in windows.activeWindow.tabs) {

            var worker = tab.attach({
                contentScriptFile: [data.url("jquery.js"), 
                data.url("inject.js")]
            });

            worker.port.on('got-url', function(data) {
                console.log(data.url);
                // worker.tab.url = data.url;
            });

            worker.port.emit('init', true);
            console.log("got here");
            //workers.push(worker);
        }
    }
});

// inject.js
$(function() {
    self.port.on('init', function() {
        console.log('in init');
        var first = $(".avatar:first");
        if (first.length !== 0) {
            var url = first.attr("href");
            console.log('injected!');
            self.port.emit('got-url', {url: url});
        }    
    });
});
Edit: sorry, should have actually run the code, we had a timing issue there where the content script was injected before the worker listener was set up, so the listener was not yet created when the 'got-url' event was emitted. I work around this by deferring any action in the content script until the 'init' event is emitted into the content script.

Here's a working example on builder:

https://builder.addons.mozilla.org/addon/1045470/latest/

The remaining issue with this example is that there is no way to tell if a tab has been injected by our add-on, so we will 'leak' or use more memory every time the widget is clicked. A better approach might be to inject the content script using a page-mod when it is loaded, and only emit the 'init' event in the widget's onclick handler.

                        
这篇关于附加组件生成器：多个工人使用端口？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！