如何在內容腳本和插件之間共享代碼？

Question

我正在爲Firefox 4+寫一個擴展。

我在一個名爲utils.js的文件中有一些代碼，我想從插件的main.js和page-mod的內容腳本中調用它。

是否可以同時參考utils.js？如果是這樣，怎麼樣？

編輯：更好的解決方案是讓我可以在谷歌瀏覽器擴展中使用相同的代碼。

Answer 1

因爲我找不到現有的解決方案，我現在只是將同一個文件複製到多個目錄（作爲構建/調試過程的一部分）。

這似乎最適合現在，特別是因爲大部分源代碼都在Google Chrome的擴展實現中重用。

爲了utils.js在Firefox中的內容腳本和在Chrome中使用（既沒有CommonJS的），我將其導入這樣的：

var Utils = Utils || require('utils').Utils; 

的utils.js這個樣子的相關部分：

function initUtils() { 
    var result = { 
     // ..define exported object... 
    }; 
    return result; 
}; 

// Chrome 
var Utils = initUtils(); 
var exports = exports || {}; 
// Firefox 
exports.Utils = Utils; 

Answer 2

我遇到了同樣的問題。你會認爲會有一個明顯的解決方案。這是我一直在爲Firefox做的事情（沒有與鉻合作）：

我有一個文件lib/dbg.js包含我想要在任何地方使用的基本調試功能。

在每個內容編寫腳本的模塊在我main.js，我有這樣的：

contextMenu.Item({ 
... 
contentScript: export_internals(require('dbg')), 
contentScriptFile: my-actual-scripts.js 
... 

，然後在主我有一個函數

​​

穿過出口性質基本上只是週期（變量，函數等），並利用諸如Function.toString（）之類的東西來基本上構建一個字符串化版本的dbg模塊，並將其作爲內聯內容腳本傳遞。此功能可能不是一般的巨大，我只是寫它來處理簡單的功能和字符串（我需要的只有兩種數據類型），但原則應該即使你只是像做

contentScript: require('dbg').my_function.toString() 

很容易地應用

到目前爲止，這顯然是一種黑客攻擊，但是非常可靠。那是你在找什麼？

Answer 3

我的解決辦法是

1. 把所有的「邏輯」（和我的「utils的」模塊）的插件代碼
2. 保持內容腳本儘可能簡單
3. ，每當內容腳本需要信息，需要utils模塊我使用內容腳本（self.port.emit，self.on ...）和附加代碼（worker.port.on ...之間的異步通信系統...）

該解決方案已導致我的插件更好的設計。但我不知道異步方法是否適用於您的情況。

Answer 4

感謝Mozilla的附加SDK參考站點上指向Implementing Reusable Modules的指針。我仍然不清楚如何執行exports調用。在他們的例子中，它們爲函數和文件使用相同的名稱。所以，在行exports.translate = translate;左邊的translate是指translate()的功能，而右邊的是指translate.js的文件，或者反之亦然？

magnoz上面的回覆（其中函數名稱和文件名稱因caSE sENSITiVitY而異）似乎暗示我應該只使用函數名稱兩次並忽略文件名稱。是這樣嗎？