Ist der Aufruf von jQuery's getScript() unzuverlässig oder mache ich etwas falsch?

Question

ich das folgende Stück Skript bin mit ein anderes zu laden:

$.getScript("CAGScript.js", function() { 
    try { 
     CAGinit(); 
    } catch(err) { 
     console.log(err); 
    } 
}); 

Die Idee ist, dass $ .getScript das Skript lädt, führt dann den Rückruf, wenn es fertig ist. CAGInit() ist eine Funktion, die in CAGScript.js lebt.

Das Problem ist, dass etwa die Hälfte der Zeit, CAGInit() (in keinem Browser) feuert. Das Protokollieren an der Firebug-Konsole meldet, dass es nicht definiert ist. Der Rest der Zeit funktioniert es perfekt.

Hat jemand irgendwelche Ideen, was ich falsch mache?

Danke.

Answer 1

Wenn die Datei auf der gleichen Domäne gehalten wird, dann wird jQuery XHR verwenden, um den Inhalt abrufen und wird global „eval“ dann es. Dies sollte gut funktionieren, aber wenn Sie Probleme haben, dann würde ich vorschlagen, die alternative Methode der Injektion eines Skript-Tags. Leider hat jQuery diese Funktionalität nicht aussetzen, so dass Sie es selbst tun werden müssen:

var script = jQuery('<script/>').attr('src', 'CAGSCript.js').appendTo('head'); 

var timer = setInterval(function(){ 
    if (window.CAGInit !== undefined) { 
     clearInterval(timer); 
     script.remove(); 
     // Do your stuff: 
     CAGInit(); 
    } 
}, 200); 

Es abstrahieren wäre am besten, diese zu einer Funktion; Das obige ist nur ein Beispiel ...

Answer 2

Ich denke, Sie können starten, indem Sie testStatus der Callback-Funktion überprüfen, um sicherzustellen, dass das Skript wirklich geladen wurde. Callback-Funktion zwei Parameter hat, mehr defails auf diejenigen, finden Sie auf jQuery Docs

$.getScript("CAGScript.js", function (data, textStatus) { 
    if (textStatus === "success") { 
     try { 
      CAGinit(); 
     } catch(err) { 
      console.log(err); 
     } 
    } else { 
     console.log("script not loaded"); 
    } 
}); 

Answer 3

hatte gerade das gleiche Problem auf Firefox, löste es mit einem kleinen Hack.

Anwendung auf Ihrem Beispiel:

$.getScript("CAGScript.js", function (xhr) { 
    try { 
     CAGinit(); 
    } catch(err) { 
     eval(xhr); 
     CAGinit(); 
    } 
}); 

Grundsätzlich eine Bewertung der XHR Reaktion zwingen, wenn sie von selbst dies nicht tut.

Answer 4

Ja, ich habe auch entdeckt, dass GetScript in FireFox unzuverlässig ist und den Callback auslöst, bevor das Skript heruntergeladen und/oder ausgeführt wurde. (Verwenden von JQuery 1.41 & FireFox 3.6. Problem scheint IE, Chrome oder Opera nicht zu beeinträchtigen.)

Ich habe nicht umfangreiche Tests durchgeführt, aber es scheint nur mit einigen bestimmten Skripts passieren ... nicht sicher warum .

RaYells Vorschlag funktioniert nicht, da getScript Erfolg meldet, obwohl das Skript noch nicht ausgewertet wurde. Pieter's Vorschlag bewirkt in den meisten Fällen, dass der Code zweimal ausgewertet wird, was ineffizient ist und Fehler verursachen kann.

Diese Alternative scheint zu funktionieren, wo GetScript nicht funktioniert. Beachten Sie, dass anscheinend ein SCRIPT-DOM-Element hinzugefügt wird, während getScript XHR verwendet.

http://www.diveintojavascript.com/projects/sidjs-load-javascript-and-stylesheets-on-demand

Answer 5

bemerkte ich das gleiche Problem mit FF 3.6.

Eine Lösung besteht darin, das Skript synchron zu laden.

Wie in jQuery's documentation erwähnt, ist getScript Abkürzung für:

$.ajax({ 
    url: url, 
    dataType: 'script', 
    success: success 
}); 

Alles funktioniert gut, wenn ich folgendes statt getScript verwenden:

$.ajax({ 
    url: url, 
    dataType: 'script', 
    success: success, 
    async: false 
}); 

Answer 6

ich etwas von diesem Problem nicht auf Chrome bekommen haben auch. jQuery ruft gelegentlich den Erfolgsrückruf auf, als ob alles in Ordnung wäre, aber das Skript wurde nicht richtig geladen. In unserem Fall war die Lösung einfach das Vertrauen auf jQuery zu ändern:

<script> 
    $.getScript("helpers.js", function() { 
     // use helpers....or: EXPLODE (wheeeee!) 
     helpers.doSomething(); 
    }); 
</script> 

Um Vertrauen in den Browser:

<script src="helpers.js"></script> 
<script> 
    helpers.doSomething(); 
</script> 

Ich bin wieder zu finden und wieder, dass „weniger jQuery == weniger Rand Fälle = = weniger Fehler ". Und normalerweise auch besser lesbaren Code!

Answer 7

Ich wollte nur einige Einblicke bieten, die ich zu diesem Thema habe. Der Rückruf wird nicht ausgelöst, wenn ein Fehler in dem Code auftritt, den Sie laden, und (zumindest in Chrome mit jQuery 1.7.1) wird der Fehler verschluckt. Ich entdeckte, dass ich eine lockige geschweifte Klammer von der automatischen Vervollständigung in dem Code hatte, den ich geladen habe, und die Rückruffunktion nicht ausgelöst wurde. Intermittierendes Verhalten hier könnte durch Ändern des geladenen Codes zwischen den Tests verursacht werden.

Answer 8

Ich wollte etwas ähnlich zu Auto_load in PHP in JS implementiert haben, die typische Lösung ist Try-Catch für alle Funktionen .. wenn die Funktion fehlt, springen wir zum Download seiner Bibliothek .. Meine Lösung stammt aus Pieter Lösung wie folgt:

function CheckUserPW(username,password){ 
    try{ 
     loginCheckUserPW(username,password); 
    } catch(err) { 
     $.getScript('login.js', function(xhr){ 
      eval(xhr); 
      loginCheckUserPW(username,password); 
     }); 
    } 
} 

Answer 9

um sicher CAGScript.js zu machen, ist geladen und ausgeführt, bevor CAGinit Funktion aufrufen, der sicherste Weg ist es, die Funktionsaufruf innerhalb CAGScript.js zu haben.

CAGScript.js:

    ... 
    /* 
    your code 
    */ 
    function CAGinit(){ 
    ... 
    } 
    ... 
    /* last line */ 
    CAGinit(); 

und dann, nur in der Hauptdatei getScript() aufrufen:

    $.getScript("CAGScript.js"); 

Answer 10

Scheint, wie jQuery Cross-Domain und gleiche Domain-Anfragen nur jetzt gut behandelt. Bei domainübergreifenden Anfragen wird ein Skript-Tag hinzugefügt und Fehler- und Ladeereignisse abonniert und die Aufrufe von done und error korrekt aufgerufen. Dies ist nur dann ein Fehler, wenn eine Anfrage fehlschlägt. Fehler beim Auswerten des Skripts werden weiterhin als Erfolg gewertet Anfrage ist betroffen. Für den gleichen Ursprung, wird es eine XHR-Anfrage machen und dann ein globalesEval machen und sobald es fertig ist, rufen Sie Ihren done Callback auf, wenn irgendetwas in diesem Prozess fehlschlägt, ruft es Ihren Fehler Callback auf.

Die Verwendung von XHR hat ein paar Probleme, es bricht den Debugger, Quellkarten und es beruht auf einem globalEval, das Probleme mit ContentSecurityPolicy hat. Zu diesem Zweck fügen wir beim Laden von Skripten einfach ein Skript-Tag hinzu.

var scriptElement = $("<script>").prop({src: url, async: true}); scriptElement.one('load',()=> ...); scriptElement.one('error', (evt)=> ...); document.head.appendChild(scriptElement[0]);

Wenn Sie es ohne jQuery Suche in this article zum dynamischen Import-Skripte tun wollen

Hoffnung, das hilft.

Answer 11

Mein Weg ist

setTimeout(function(){ 
    $.getScript("CAGScript.js"); 
    }, 
2000); 

das gleiche Problem, das wir auch in Winkel konfrontiert werden, wenn wir aktualisieren Daten in Rahmen $ wollen, und es wird unter Verwendung von $ timeout in gleicher Weise in Winkel gelöst ...