self.port 是未定义的错误 [在 mozilla 附加 SDK 1.8 上]答案

【问题标题】：self.port is undefined error [on mozilla add-on SDK 1.8]self.port 是未定义的错误 [在 mozilla 附加 SDK 1.8 上]
【发布时间】：2016-08-03 19:40:14
【问题描述】：

按照this 指南，我做了一些改动，但我一直收到这个错误：

self.port 未定义在 base.js[我的内容代码]

这里是我的附加代码：

PageMod({
    include: [data.url('base.html')],
    contentScriptWhen: 'start',
    contentScriptFile: [data.url('jquery-1.7.2.min.js'),data.url('jquery-ui-1.8.21.custom.min.js'),data.url('base.js')],
    contentStyleFile: [data.url('css/mint-choc/jquery-ui-1.8.21.custom.css'),data.url('css/base.css')],
    onAttach: function(worker) {
            worker.port.on("request", function(txt) {
                console.log(txt);
                worker.port.emit("response","response for "+txt);
            });
    }
});

和我的内容代码：

// initialized by jQuery
$(function() {
    self.port.on("response",function(txt){console.log("response "+txt);}) //this line is where the error point to.
    $('#tabs').tabs();
    testLoadLinks();
});

function testReceiveRequest(request) {
    console.log('received:',request);
    self.port.emit("request",request);
}

我正在使用 SDK 版本 1.8 的浏览器编辑器，有人可以帮我解决这个问题吗？

【问题讨论】：

我不清楚什么是坏的，我们有这样的例子 (builder.addons.mozilla.org/addon/1065275/latest) 在内容脚本中使用 self.port 时工作正常。
@canuckistani 我复制了您的代码，并更改了 main.js 中的第 14 行，您忘记了 worker.on 中的端口，它可以正常工作。但是当我拉 Firebug 并输入 self.port.emit('from-content-script','test123') 我仍然得到 self.port is undefined 错误，这个功能是否只能在有限的时间内使用？在我的代码中，我们只有在 DOM 准备好时才让 jQuery 调用该函数，也许当 DOM 准备好时 self.port 已经“消失”了？
'self.port.on' 只存在于内容脚本的单独范围内，绝对没有定义在主页面范围内。有关内容脚本的更多信息，请参阅文档：addons.mozilla.org/en-US/developers/docs/sdk/1.8/dev-guide/…

标签： firefox-addon firefox-addon-sdk

【解决方案1】：

经过一些测试和调试，我发现了我的两个错误，很抱歉我没有把整个代码放出来，因为我认为它不相关：

我在 base.html

中有这个

<link type="text/css" href="css/mint-choc/jquery-ui-1.8.21.custom.css" rel="stylesheet" />
<link type="text/css" href="css/base.css" rel="stylesheet" />
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.21.custom.min.js"></script>
<script type="text/javascript" src="js/base.js"></script>

这在 main.js

上

PageMod({
include: [data.url("base.html")],
contentScriptWhen: 'start',
contentScriptFile: [data.url('jquery-1.7.2.min.js'),data.url('jquery-ui-1.8.21.custom.min.js'),data.url('base.js')],
contentStyleFile: [data.url('css/mint-choc/jquery-ui-1.8.21.custom.css'),data.url('css/base.css')],
onAttach: function(worker) {
        console.log("attaching...")
        worker.port.on("request", function(txt) {
            console.log(txt);
            worker.port.emit("response","response for "+txt);
        });
}
});

我的脚本位于 /data/js/ 文件夹中，因此无法在 main.js 中加载脚本的 pageMod 部分，但它们是由 DOM 内的内容脚本本身加载的，其中self.port 未定义。我刚刚从 base.html 中删除了脚本和样式标签，因为它们已经在 pageMod 中，并修复了 data.url('js/base.js') 和其他中的路径。现在我了解到附加范围内的脚本可以访问 DOM 范围并对其进行更改，但是 DOM 内的脚本不能（它们可以？）与附加范围通信。如果您希望脚本与插件交互，您应该将它们留在插件范围内。我希望能帮助犯同样错误的人。谢谢canuckistani。

【讨论】：

嗨！你能帮我解决类似的问题吗？
@user2543953，如果您有新问题，请点击按钮提出。如果有助于提供上下文，请包含指向此问题的链接。