Wiele plików JS w rozszerzeniach Chrome - jak je załadować?

Question

Napisałem rozszerzenie do Chrome. Mój plik background.js jest dość duży, więc chcę podzielić go na mniejsze części i załadować określone metody, gdy jest to wymagane (jakiś rodzaj leniwego ładowania).

Robiłem to z Firefox:

// (call for load specified lib) 
var libPath = redExt.basePath + 'content/redExt/lib/' + redExt.browser + '/' + libName + '.js'; 
var service = Components.classes["@mozilla.org/moz/jssubscript-loader;1"].getService(Components.interfaces.mozIJSSubScriptLoader); 
service.loadSubScript("chrome://" + libPath); 
// (executing loaded file) 

Czy istnieje możliwośc zrobić podobną drogę w przeglądarkach opartych na silniku WebKit? Znalazłem rozwiązania, jak wstrzykiwać wiele plików JS do pasujących stron (przy użyciu manifest.json), ale nie mogę znaleźć sposobu na dołączenie pliku JS tylko dla rozszerzenia.

Answer 1

że możliwe rozwiązania. Istnieje prosta implementacja głównej metody RequireJS, która wymaga śledzenia wywołania zwrotnego JavaScript, aby znaleźć zdarzenie do załadowania głównego pliku rozszerzenia, a powiązania wykonują go z kontekstem rozszerzenia. https://github.com/salsita/browser-require/blob/master/require.js

wydaje się działać, ale to rozwiązanie ma kilka wad:

• raporty o błędach podano w „linii 1, kolumna 1”, ponieważ to rozwiązanie wstrzykuje kod bezpośrednio do func.call - debugowanie jest bardzo trudne
• Załadowane pliki JS nie pojawia się w konsoli/chromebug
• Jeśli zakładka prąd wykorzystuje HTTPS Chrome uniemożliwi evaling skryptów, zwłaszcza to z kontekstu lokalnego (file:///), więc czasami po prostu nie pracy zgodnie z oczekiwaniami

Answer 2

Możesz spróbować użyć pracowników sieci. W swoim background.js, obejmują:

var worker = new Worker('new-script.js'); 

sieci pracownicy mogą tarło nowych pracowników, a nawet mieć metodę importScript ("New-script.js").

Pracownicy WWW mogą jednak być bardzo ograniczeni. Sprawdź here, aby uzyskać świetny artykuł na temat pracowników internetowych.

Nie wiem, czy zadziałają. Inną opcją jest użycie XMLHTTPRequest (AJAX) w celu dynamicznego pobrania skryptu i sprawdzenia go. Jednak w przypadku połączenia innego niż HTTPS jest to prawdopodobnie zablokowane z powodu ataków typu "man-in-the-middle". Alternatywnie, można wymusić Chrome eval skryptu z non-szyfrowane połączenie (ale nie rób tego) dodając to do manifest.json:

"content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'", 
"permissions": ["http://badpractic.es/insecure.js"] 

Zobacz Load remote webpage in background page: Chrome Extension do bardziej pogłębionej dyskusji metody AJAX .

Twoje opcje wydają się być ograniczone.

To oczywiście ładunku je wszystkie na raz:

{ 
    "name": "My extension", 
    ... 
    "background": { 
    "scripts": ["background.js","background2.js","background3.js"] //and so on 
    }, 
    ... 
} 

Answer 3

Jeśli chcesz załadować plik javascript w kontekście strony tła i chcesz uniknąć używania eval, możesz po prostu dodać znacznik script do DOM-a strony tła.Na przykład, to działa, jeśli pliki są obecne w folderze lib swojego rozszerzenia: https://developer.chrome.com/extensions/background_pages#manifest

{ 
    "name": "My extension", 
    ... 
    "background": { 
    "scripts": [ 
     "lib/fileone.js", 
     "lib/filetwo.js", 
     "background.js" 
    ] 
    }, 
    ... 
} 

Wygrałeś:

function loadScript(scriptName, callback) { 
    var scriptEl = document.createElement('script'); 
    scriptEl.src = chrome.extension.getURL('lib/' + scriptName + '.js'); 
    scriptEl.addEventListener('load', callback, false); 
    document.head.appendChild(scriptEl); 
} 

Answer 4

Można również to niezwykle prosty sposób, który jest opisany tutaj zrobić nie robisz leniwego ładowania, ale pozwala ci to na złamanie kodu w wielu plikach i określenie kolejności, w jakiej są ładowane na stronę w tle.