Frage Beste Möglichkeit, Googles gehostete jQuery zu nutzen, aber bei Google auf meine gehostete Bibliothek zurückgreifen, scheitern


Was wäre ein guter Weg zu versuchen, zu laden die gehostete jQuery bei Google (oder andere von Google gehostete Bibliotheken), aber laden Sie meine Kopie von jQuery, wenn der Google-Versuch fehlschlägt?

Ich sage nicht, dass Google flockig ist. Es gibt Fälle, in denen die Google-Kopie blockiert ist (z. B. im Iran).

Würde ich einen Timer einrichten und nach dem jQuery-Objekt suchen?

Was wäre die Gefahr, dass beide Kopien durchkommen?

Nicht wirklich auf der Suche nach Antworten wie "benutze einfach den Google one" oder "nutze einfach deinen eigenen". Ich verstehe diese Argumente. Ich verstehe auch, dass die Google-Version wahrscheinlich zwischengespeichert wird. Ich denke über Rückfälle für die Cloud im Allgemeinen nach.


Edit: Dieser Teil hinzugefügt ...

Da Google vorschlägt, google.load zu verwenden, um die Ajax-Bibliotheken zu laden, und es einen Rückruf durchführt, wenn das erledigt ist, frage ich mich, ob das der Schlüssel zum Serialisieren dieses Problems ist.

Ich weiß, es klingt ein bisschen verrückt. Ich versuche nur herauszufinden, ob es zuverlässig funktioniert oder nicht.


Update: jQuery wurde jetzt auf Microsofts CDN gehostet.

http://www.asp.net/ajax/cdn/


982
2018-06-18 17:51


Ursprung


Antworten:


Du kannst es so erreichen:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script>
   window.jQuery || document.write('<script src="/path/to/your/jquery"><\/script>');
</script>

Dies sollte in Ihrer Seite sein <head> und alle jQuery-fähigen Event-Handler sollten in der <body> um Fehler zu vermeiden (obwohl es nicht narrensicher ist!).

Ein Grund mehr nicht Verwenden Sie von Google gehostete jQuery. In einigen Ländern ist der Domainname von Google gesperrt.


774
2018-02-22 18:05



Der einfachste und sauberste Weg, dies bei weitem zu tun:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="path/to/your/jquery"><\/script>')</script>

328
2018-06-22 01:15



Dies scheint für mich zu funktionieren:

<html>
<head>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
// has the google object loaded?
if (window.google && window.google.load) {
    google.load("jquery", "1.3.2");
} else {
    document.write('<script type="text/javascript" src="http://joecrawford.com/jquery-1.3.2.min.js"><\/script>');
}
window.onload = function() {
    $('#test').css({'border':'2px solid #f00'});
};
</script>
</head>
<body>
    <p id="test">hello jQuery</p>
</body>
</html>

Die Art, wie es funktioniert, ist die Verwendung der google Objekt, das anruft http://www.google.com/jsapi lädt auf die window Objekt. Wenn dieses Objekt nicht vorhanden ist, gehen wir davon aus, dass der Zugriff auf Google fehlschlägt. Wenn dies der Fall ist, laden wir eine lokale Kopie mit document.write. (Ich benutze in diesem Fall meinen eigenen Server, bitte benutzen Sie Ihren eigenen Server, um dies zu testen).

Ich teste auch auf die Anwesenheit von window.google.load - Ich könnte auch tun typeof Überprüfen Sie, ob Dinge Objekte oder Funktionen sind. Aber ich denke, das macht den Trick.

Hier ist nur die Ladelogik, da die Code-Hervorhebung fehlzuschlagen scheint, seit ich die ganze HTML-Seite gepostet habe, die ich getestet habe:

if (window.google && window.google.load) {
    google.load("jquery", "1.3.2");
} else {
    document.write('<script type="text/javascript" src="http://joecrawford.com/jquery-1.3.2.min.js"><\/script>');
}

Obwohl ich sagen muss, ich bin mir nicht sicher, ob, wenn dies eine Sorge für Ihre Website - Besucher ist, sollten Sie mit der Google AJAX-Bibliotheks-API überhaupt.

Lustige Tatsache: Ich habe anfangs versucht, einen try..catch-Block dafür in verschiedenen Versionen zu verwenden, konnte aber keine so saubere Kombination finden. Ich wäre daran interessiert, andere Implementierungen dieser Idee als Übung zu sehen.


73
2018-06-26 20:41



Wenn Sie modernizr.js auf Ihrer Site eingebettet haben, können Sie die integrierte Datei yepnope.js verwenden, um Ihre Skripte asynchron zu laden - unter anderem jQuery (mit Fallback).

Modernizr.load([{
    load : '//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'
},{
    test : window.jQuery,
    nope : 'path/to/local/jquery-1.7.2.min.js',
    both : ['myscript.js', 'another-script.js'],
    complete : function () {
        MyApp.init();
    }
}]);

Dies lädt jQuery von der Google-CDN. Danach wird geprüft, ob jQuery erfolgreich geladen wurde. Wenn nicht ("nein"), wird die lokale Version geladen. Auch Ihre persönlichen Skripte werden geladen - die "beide" zeigen an, dass der Ladeprozess unabhängig vom Testergebnis gestartet wird.

Wenn alle Ladeprozesse abgeschlossen sind, wird eine Funktion ausgeführt, im Fall 'MyApp.init'.

Ich persönlich bevorzuge diese Art des asynchronen Ladens von Skripten. Und da ich mich bei der Erstellung einer Site auf die Feature-Tests von modernizr stütze, habe ich sie trotzdem auf der Site eingebettet. Es gibt also keinen Overhead.


30
2018-06-26 17:02



Es gibt hier einige großartige Lösungen, aber ich würde gerne einen Schritt weiter gehen, wenn es um die lokale Datei geht.

In einem Szenario, in dem Google fehlschlägt, sollte es eine lokale Quelle laden, aber möglicherweise ist eine physische Datei auf dem Server nicht unbedingt die beste Option. Ich führe das auf, weil ich derzeit dieselbe Lösung implementiere, nur möchte ich auf eine lokale Datei zurückgreifen, die von einer Datenquelle generiert wird.

Meine Gründe dafür sind, dass ich ein bisschen Verstand haben möchte, wenn es darum geht, zu verfolgen, was ich von Google lade und was ich auf dem lokalen Server habe. Wenn ich die Versionen ändern möchte, möchte ich meine lokale Kopie mit dem synchronisieren, was ich von Google laden möchte. In einer Umgebung, in der es viele Entwickler gibt, wäre der beste Weg, diesen Prozess zu automatisieren, so dass man nur eine Versionsnummer in einer Konfigurationsdatei ändern müsste.

Hier ist meine vorgeschlagene Lösung, die in der Theorie funktionieren sollte:

  • In einer Anwendungskonfigurationsdatei speichere ich drei Dinge: die absolute URL für die Bibliothek, die URL für die JavaScript-API und die Versionsnummer
  • Schreiben Sie eine Klasse, die den Dateiinhalt der Bibliothek selbst abruft (holt die URL aus der App-Konfiguration), speichert sie in meiner Datenquelle mit dem Namen und der Versionsnummer
  • Schreiben Sie einen Handler, der meine lokale Datei aus der Datenbank holt und die Datei zwischenspeichert, bis sich die Versionsnummer ändert.
  • Wenn es sich ändert (in meiner App-Konfiguration), zieht meine Klasse den Inhalt der Datei basierend auf der Versionsnummer, speichert sie als neuen Datensatz in meiner Datenquelle, dann tritt der Handler ein und liefert die neue Version.

In der Theorie, wenn mein Code richtig geschrieben ist, alles, was ich tun müsste, ist die Versionsnummer in meiner App Config dann Viola zu ändern! Sie haben eine Fallback-Lösung, die automatisiert ist, und Sie müssen keine physischen Dateien auf Ihrem Server verwalten.

Was denkt jeder? Vielleicht ist das Overkill, aber es könnte eine elegante Methode zur Pflege Ihrer AJAX-Bibliotheken sein.

Eichel


20
2018-01-28 05:49



if (typeof jQuery == 'undefined') {
// or if ( ! window.jQuery)
// or if ( ! 'jQuery' in window)
// or if ( ! window.hasOwnProperty('jQuery'))    

  var script = document.createElement('script');
  script.type = 'text/javascript';
  script.src = '/libs/jquery.js';

  var scriptHook = document.getElementsByTagName('script')[0];
  scriptHook.parentNode.insertBefore(script, scriptHook);

}

Nachdem Sie versucht haben, die Google-Kopie aus dem CDN zu übernehmen.

In HTML5 müssen Sie nicht festlegen type Attribut.

Sie können auch ...

window.jQuery || document.write('<script src="/libs/jquery.js"><\/script>');

19
2018-01-12 16:42



Möglicherweise möchten Sie Ihre lokale Datei als letzten Ausweg verwenden.

Scheint ab jetzt jQuery's eigene CDN unterstützt kein https. Wenn es Sie tat, dann möchten Sie vielleicht zuerst von dort laden.

Also hier ist die Reihenfolge: Google CDN => Microsoft CDN => Ihre lokale Kopie.

<!-- load jQuery from Google's CDN -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
<!-- fallback to Microsoft's Ajax CDN -->
<script> window.jQuery || document.write('<script src="//ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.3.min.js">\x3C/script>')</script> 
<!-- fallback to local file -->
<script> window.jQuery || document.write('<script src="Assets/jquery-1.8.3.min.js">\x3C/script>')</script> 

8
2018-02-21 16:09