2

Ich experimentiere mit der Google-Schließbibliothek und arbeite durch the official XhrIo guide. ich in einige Schwierigkeiten lief mit dem xhr-quick2.js Beispiel reproduziert unter:Zugriff auf `goog.require`d Objekt in der Schließbibliothek ohne Kompilierung

goog.require('goog.net.XhrIo'); 

var xhr = new goog.net.XhrIo(); 

goog.events.listen(xhr, goog.net.EventType.COMPLETE, function(e) { 
    obj = this.getResponseJson(); 
    log('Received Json data object with title property of "' + 
     obj['title'] + '"'); 
    alert(obj['content']); 
}); 

function getData(dataUrl) { 
    log('Sending simple request for ['+ dataUrl + ']'); 
    xhr.send(dataUrl); 
} 

Sobald er ausgeführt wird, erhalte ich die Fehlermeldung:

Uncaught TypeError: Cannot read property 'XhrIo' of undefined

Wenn ich den Ereignis-Listener und xhr Instanziierung innerhalb der getData bewegen Funktion (die in der onload des Körpers genannt wird), ist alles gut.

goog.require('goog.net.XhrIo') 

function getData(dataUrl) { 
    var xhr = new goog.net.XhrIo() 

    goog.events.listen(xhr, goog.net.EventType.COMPLETE, function(e) { 
    obj = this.getResponseJson() 
    log(`Received Json data object with title property of "${ obj["title"] }"`) 
    alert(obj["content"]) 
    }) 

    log(`Sending simple request for [${ dataUrl }]`) 
    xhr.send(dataUrl) 
} 

function log(msg) { 
    document.getElementById('log').appendChild(document.createTextNode(msg)); 
    document.getElementById('log').appendChild(document.createElement('br')); 
} 

Ich nehme an, das liegt daran, dass goog.require nicht beendet hat net importieren, wenn goog.net.XhrIo in Zeile 3 des ersten Codebeispiel instanziiert wird. Ich nehme an, die ideale Lösung ist, um alle meine Code durch die Schließung Compiler laufen, aber ich bin nur experimentieren und other parts of the documentation meinen Workflow ist akzeptabel für die Entwicklung.

Gibt es etwas, das ich in meinem HTML manuell quellen kann, das dieses Problem beseitigen würde? Gibt es eine andere Herangehensweise, die ich ergreifen sollte?

Antwort

2

Es ist ein paar Jahre her, seit ich das letzte Mal mit Closure gespielt habe, aber ich denke nicht, dass man es nur ohne den Dependency Compiler verwenden kann.

Verschluss funktioniert durch das Scannen Sie Ihre JavaScript-Dateien für goog.module und goog.require eine deps.js Datei zu schreiben. Diese Datei muss zuerst vor Ihren JavaScript-Dateien geladen werden. Es listet alle vom Code verwendeten Module auf und lädt sie in der richtigen Reihenfolge.

Wenn deps.js zuerst kommt, dann wird goog.net in die Zeit geladen werden, bis es zu Ihrem Code kommt. Der Code goog.require('goog.net.XhrIo') in Zeile 1 wird zu diesem Zeitpunkt ignoriert.

die Dokumentation Nach den goog.require fügen einen <script> Tag nach die aktuellen <script> ausgeführt wird. Also, wenn Sie den Schritt der Verwendung von deps.js überspringen möchten, dann müssen Sie alles in einem Dokument bereit Rückruf rückgängig machen, oder manaqully hinzufügen goog.require zu einer JavaScript-Datei, die vor Ihrem Code geladen wird.

Ich denke, es ist nicht die Mühe wert und einfacher, nur die Schließung Abhängigkeit Schriftsteller zu verwenden, um die deps.js Datei zu erstellen.

Es gibt eine kurze Anleitung hier:

https://www.safaribooksonline.com/library/view/closure-the-definitive/9781449381882/ch01.html

Hier ist die CLI für das Schreiben der deps.js Datei:

python ../closure-library/closure/bin/calcdeps.py \ 
    --dep ../closure-library \ 
    --path my_stuff.js \ 
    --output_mode deps > deps.js 
0

Für kompilierten Modus das gewünschte Dokument werden müssen vorinstalliert. So in Ihrem HTML-Dokument hätten Sie:

<!DOCTYPE html> 
<html> 
    <head> 
    <script src="path/to/closure/base.js"></script> 
    <script> 
     goog.require('goog.net.XhrIo'); 
    </script> 
    <script src="mysource.js"></script> 
    </head> 
</html> 

Alle Abhängigkeiten müssen in einem separaten Skript-Tag geladen werden.Dann sollten die obigen Codebeispiele funktionieren.