Pregunta La mejor forma de utilizar jQuery alojado en Google, pero volver a caer en mi biblioteca alojada en Google falla


¿Cuál sería una buena manera de intentar cargar el jQuery alojado en Google (u otras bibliotecas alojadas en Google), pero cargue mi copia de jQuery si falla el intento de Google?

No digo que Google sea escamoso. Hay casos en que la copia de Google está bloqueada (aparentemente en Irán, por ejemplo).

¿Configuraría un temporizador y verificaría el objeto jQuery?

¿Cuál sería el peligro de que lleguen ambas copias?

Realmente no busca respuestas como "solo use Google" o "solo use la suya". Entiendo esos argumentos También entiendo que es probable que el usuario tenga la versión de Google en la memoria caché. Estoy pensando en retrocesos para la nube en general.


Editar: Esta parte agregó ...

Dado que Google sugiere usar google.load para cargar las bibliotecas de AJAX, y realiza una devolución de llamada una vez hecho, me pregunto si esa es la clave para serializar este problema.

Sé que suena un poco loco. Solo estoy tratando de descubrir si se puede hacer de manera confiable o no.


Actualización: jQuery ahora alojado en CDN de Microsoft.

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


982
2018-06-18 17:51


origen


Respuestas:


Puedes lograrlo así:

<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>

Esto debería estar en la página de tu <head> y cualquier controlador de eventos jQuery ready debe estar en el <body> para evitar errores (¡aunque no es infalible!).

Una razón más para no utilizar jQuery alojado en Google es que en algunos países, el nombre de dominio de Google está prohibido.


774
2018-02-22 18:05



La forma más fácil y limpia de hacer esto de lejos:

<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



Esto parece funcionar para mí:

<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>

La forma en que funciona es usar el google objetar esa vocación http://www.google.com/jsapi cargas en el window objeto. Si ese objeto no está presente, estamos asumiendo que el acceso a Google está fallando. Si ese es el caso, cargamos una copia local usando document.write. (Estoy usando mi propio servidor en este caso, por favor use el suyo para probar esto).

También pruebo la presencia de window.google.load - También podría hacer una typeof Verifique que las cosas sean objetos o funciones según corresponda. Pero creo que esto hace el truco.

Aquí está solo la lógica de carga, ya que el resaltado del código parece fallar ya que publiqué toda la página HTML que estaba probando:

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>');
}

Aunque debo decir que no estoy seguro de que, si esto es una preocupación para los visitantes de su sitio, deberían estar jugando con el API de bibliotecas AJAX de Google en absoluto.

Hecho de la diversión: Intenté usar inicialmente un bloque try..catch para esto en varias versiones pero no pude encontrar una combinación que fuera tan limpia como esta. Me interesaría ver otras implementaciones de esta idea, puramente como un ejercicio.


73
2018-06-26 20:41



Si tiene modernizr.js incrustado en su sitio, puede usar el yepnope.js incorporado para cargar sus scripts de forma asincrónica, entre otros jQuery (con respaldo).

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();
    }
}]);

Esto carga jQuery del Google-cdn. Luego se verifica si jQuery se cargó correctamente. Si no ("nope"), se carga la versión local. También se cargan sus scripts personales; el "both" indica que el proceso de carga se inicia independientemente del resultado de la prueba.

Cuando se completan todos los procesos de carga, se ejecuta una función, en el caso 'MyApp.init'.

Personalmente, prefiero esta forma de carga de scripts asincrónicos. Y como confío en las pruebas de funciones proporcionadas por modernizr cuando construyo un sitio, lo tengo incorporado en el sitio de todos modos. Entonces no hay gastos generales.


30
2018-06-26 17:02



Aquí hay algunas soluciones geniales, pero me gustaría dar un paso más con respecto al archivo local.

En un escenario en el que Google falla, debe cargar una fuente local, pero tal vez un archivo físico en el servidor no sea necesariamente la mejor opción. Lo menciono porque actualmente estoy implementando la misma solución, solo quiero recurrir a un archivo local generado por una fuente de datos.

Mis razones para esto es que quiero tener algo de tranquilidad cuando se trata de hacer un seguimiento de lo que cargo de Google frente a lo que tengo en el servidor local. Si deseo cambiar las versiones, querré que mi copia local se sincronice con lo que intento cargar de Google. En un entorno en el que hay muchos desarrolladores, creo que el mejor enfoque sería automatizar este proceso para que todo lo que uno deba hacer sea cambiar un número de versión en un archivo de configuración.

Aquí está mi solución propuesta que debería funcionar en teoría:

  • En un archivo de configuración de la aplicación, almacenaré 3 cosas: URL absoluta para la biblioteca, la URL para la API de JavaScript y el número de versión
  • Escriba una clase que obtenga el contenido del archivo de la biblioteca (obtiene la URL de la configuración de la aplicación), la almacena en mi fuente de datos con el nombre y el número de versión
  • Escriba un controlador que extraiga mi archivo local de la base de datos y guarde en caché el archivo hasta que cambie el número de versión.
  • Si cambia (en la configuración de mi aplicación), mi clase extraerá el contenido del archivo en función del número de versión, lo guardará como un nuevo registro en mi fuente de datos, y luego el controlador iniciará y publicará la nueva versión.

En teoría, si mi código está escrito correctamente, todo lo que tendría que hacer es cambiar el número de versión en la configuración de mi aplicación y luego ¡viola! Usted tiene una solución alternativa que es automática, y no tiene que mantener archivos físicos en su servidor.

¿Qué piensan todos? Tal vez esto sea excesivo, pero podría ser un método elegante para mantener sus bibliotecas AJAX.

Bellota


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);

}

Después de intentar incluir la copia de Google desde el CDN.

En HTML5, no necesita configurar el type atributo.

También puedes usar...

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

19
2018-01-12 16:42



Es posible que desee utilizar su archivo local como último recurso.

Parece que a partir de ahora el propio CDN de jQuery no es compatible con https. Si lo hizo, entonces es posible que desee cargar desde allí primero.

Así que aquí está la secuencia: Google CDN => Microsoft CDN => Su copia local.

<!-- 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



Cargue condicionalmente la última versión heredada de jQuery y la alternativa:

<!--[if lt IE 9]>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script>window.jQuery || document.write('<script src="/public/vendor/jquery-legacy/dist/jquery.min.js">\x3C/script>')</script>
<![endif]-->
<!--[if gte IE 9]><!-->
    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
    <script>window.jQuery || document.write('<script src="/public/vendor/jquery/dist/jquery.min.js">\x3C/script>')</script>
<!--<![endif]-->

7
2018-06-19 06:41



  • Paso 1: ¿jQuery no se cargó? (comprobar jQuery variable)

Cómo verificar una variable no definida en JavaScript

  • Paso 2: importar dinámicamente (la copia de seguridad) archivo javascript

¿Cómo incluyo un archivo JavaScript en otro archivo JavaScript?


5
2018-06-05 09:02



Debido al problema de prohibición de Google, prefiero usar el cdn de Microsoft http://www.asp.net/ajaxlibrary/cdn.ashx


5
2017-07-07 10:06



¡Aquí hay una gran explicación sobre esto!

¡También implementa demoras y tiempos de espera de carga!

http://happyworm.com/blog/2010/01/28/a-simple-and-robust-cdn-failover-for-jquery-14-in-one-line/


4
2017-10-20 09:36