访问browser.runtime.getBackgroundPage()中的变量

Question

我目前正在构建一个以create-react-app为基础的浏览器扩展，尝试使用getBackgroundPage()而不是消息传递API来在后台脚本(我定义了3个)和新的选项卡页面之间进行通信，但似乎在新的选项卡页面中调用browser.runtime.getBackgroundPage()会返回一个窗口对象，而不会将后台脚本中的任何函数或变量作为窗口属性附加。

下面返回"variable not defined“错误和"page.foo() is not a function”。

// background_3.js

var test = [];

// Some stuff so webpack doesn't get rid of the unused variable.
for (let i = 0; i < 10; ++i) {
    test.push(i);
}

function foo() {
    console.log("foo");
}

// New Tab React page
import browser from "webextension-polyfill";

browser.runtime.getBackgroundPage()
    .then(page => {
        console.log(page.test);
        page.foo();
    });

我是不是做错了什么？我应该只使用消息API吗？

Answer 1

原来，webpack正在将我的后台脚本包装在其他一些函数中，这就是破坏东西的地方。您可以像wOxxOm建议的那样，只需执行window.foo = foo操作，就可以手动将内容附加到背景脚本中的窗口对象。