javascript - Firefox扩展开发: How do I create a global function inside a content script, 那么其他加载的脚本文件可以访问它吗？

Question

在我的 main.js 文件中，我有一个包含 base.js 文件的 PageMod:

pageMod.PageMod({
    contentScriptFile: ["./base.js"]

我的 base.js 文件中有一个函数

function setupPayment(){ /* DO STUFF HERE */ }

在我的 base.js 文件中，我还加载其他 JS 文件

$.getScript("https://checkout.stripe.com/checkout.js", function(){
    $.getScript( self.options.stripe );
});

在我的 stripe.js 文件中，我尝试调用 base.js 文件中的 setupPayment 函数

var yearhandler = StripeCheckout.configure({
    key: "pk_live_...",
    image: "image.png",
    name: "SHINE",
    description: "Subscription",
    panelLabel: "Subscribe",
    allowRememberMe: false,
    token: function(token) {

        plan = "yearly";

        setupPayment(token,plan);

    }
});

但是 setupPayment 返回未定义。

经过一些测试后，看起来通过 $.getScript 包含的任何脚本都无法访问我的 base.js 内容脚本内的任何函数？有没有办法使我的 base.js 内容脚本中的函数在我加载的所有其他脚本文件中全局化？

感谢您的帮助!

编辑:setupPayment() 必须位于 base.js 文件中的原因是它可以与 main.js 文件通信并存储一些信息。

Answer 1

您现在可以将内容脚本中的函数导出到页面中，请参阅this blog post对于血淋淋的细节。代码如下所示:

function setupPayment(args, callback) {
  // some code
  callback(result); 
  // your callback should use postMessage to send data back to the
  // content script, see these docs:
  // https://developer.mozilla.org/en-US/Add-ons/SDK/Guides/Content_Scripts/Interacting_with_page_scripts#Communicating_with_page_scripts 
}

exportFunction(setupPayment, unsafeWindow, {defineAs: "setupPayment"});