Firefox 扩展开发：如何在内容脚本中创建全局函数，以便其他加载的脚本文件可以访问它？答案

【问题标题】：Firefox extension development: How do I create a global function inside a content script, so other loaded script files can access it?Firefox 扩展开发：如何在内容脚本中创建全局函数，以便其他加载的脚本文件可以访问它？
【发布时间】：2015-03-21 18:06:01
【问题描述】：

在我的 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 返回 undefined。

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

感谢您的帮助！

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

【问题讨论】：

确保你的函数是 jquery 函数。在 document.ready 内部，而不是 Javascript 函数。还要在 document.ready 和所有脚本开始之前声明你的变量。

标签： javascript jquery firefox firefox-addon firefox-addon-sdk

【解决方案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"});

【讨论】：

【解决方案2】：

ContentScripts 在 sandboxes 中运行，我不知道 jquery 在内部做了什么，但它肯定不是设计来了解多个 javascript 上下文和 mozilla 的 xray wrappers，所以它可能只是将<script> 标签注入到 DOM 中，然后在页面上下文而不是 contentScript 沙箱中运行加载的 javascript。

考虑到您只加载 base.js，我什至不确定您如何在沙箱中访问 jquery。

所以看起来你的插件代码的很大一部分实际上是在不受信任的页面上下文中运行/加载脚本。

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

不完全是。您可以通过exportFunction 将特权函数导出到页面上下文，该函数在沙箱中可用。

【讨论】：