2012-11-14 9 views
6

Ich habe eine Firefox-Erweiterung mit dem Addon SDK entwickelt und muss einige Daten, die im selben Paket gespeichert sind, als separate Datei laden: "Daten .json ". Es muss von einem Seitenskript geladen werden, d. H. "Loader.js", das in der "panel.html" enthalten ist, unter Verwendung der Skript-src-Tags.Laden einer JSON-Datei in Firefox Addon Page Script, alles lokal im Paket

Die Struktur ist wie folgt:

+data 
panel.html 
panel.js 
loader.js 
data.json 
... 
+lib 
main.js 
... 

panel.html hat:

<script type="text/javascript" src="loader.js"></script> 

Zunächst gespeichert wir die Daten einfach in eine js-Datei als "data.js" und enthalten aus dem " panel.html "mit Skript src Tags und es funktionierte ohne Probleme. Als wir jedoch das Add-on an die Mozilla Addon-Site übermittelten, wurde dies als eines der zu behebenden Probleme angesprochen, da wir sagen müssen, dass wir ein nicht ausführbares Format wie eine JSON-Datei verwenden müssen, um es sicherer zu machen.

Jetzt scheint das Problem wie "loader.js" ist nicht erlaubt, eine AJAX-Anfrage zu "data.json" zu machen. (Die Verwendung des Aufrufs JQuery $ .ajax() erfolgt ohne Erfolg und gibt den Fehlercode 0) Also die Lösung, an die ich gedacht habe, ist das Laden von "data.json" aus "main.js" mit der SDK-Funktion request() und übergebe es irgendwie an das "loader.js", das Seitenskript. Aber das scheint kompliziert zu sein, da, soweit ich weiß, die Daten zuerst an ein Inhaltsskript und dann von dort an das Seitenskript gesendet werden müssen. Und das muss geschehen, wenn das Seitenskript geladen wird! Ich bin darüber verwirrt, da ich nicht sicher bin, ob mir eine viel praktischere Lösung fehlt, oder ist es wirklich etwas Kompliziertes, was ich versuche, indem ich einfach lokale JSON-Daten in das Paket in ein lokales Seitenskript lade?

Antwort

7

Hier ist ein Beispiel für den Add-on-Builder, der dieses Thema untersucht und sich diesem nähert.

First off, können Sie die JSON-Datei von Daten laden und analysieren es self.data.load mit:

let data = require('self').data; 

let taps_data = JSON.parse(data.load('taps.json')); 

Diese Lasten synchron, so dass es nicht etwas, das man oft tun möchte, ist, in der Zum Beispiel würde es nur passieren, wenn das Add-on firstst in einer Browsing-Sitzung aktiv wird.

Als Nächstes würden Sie Inhaltsskripts und Nachrichtenübergabe verwenden, um die Daten an das Panel zu übergeben.

Im main.js Skript:

panel.on('show', function() { 
    if (!loaded) 
     panel.port.emit('taps-data', taps_data); 
}); 

Im Content-Skript:

self.port.on('taps-data', function(data) { 
    $('#list').html(''); 
    data.forEach(function(item) { 
     $('#list').append('<div>'+ item.name +'</div>'); 
    }); 
    self.port.emit('taps-loaded'); 
}); 

ich ein bisschen mehr Arbeit, um sicherzustellen, ich bin nur die Daten einmal emittiert. Die Daten, FYI, werden von den Live-Bierfassdaten api von my local pub gespeichert.