validacion - Compruebe si existe conexión a Internet con Javascript?
validar formulario javascript antes de enviar (9)
El envío de solicitudes XHR es malo porque podría fallar si ese servidor en particular está inactivo. En su lugar, use la biblioteca de API de Google para cargar sus versiones en caché de jQuery.
Puede usar la API de Google para realizar una devolución de llamada después de cargar jQuery, y esto comprobará si jQuery se cargó correctamente. Algo como el siguiente código debería funcionar:
<script type="text/javascript">
google.load("jquery");
// Call this function when the page has been loaded
function test_connection() {
if($){
//jQuery WAS loaded.
} else {
//jQuery failed to load. Grab the local copy.
}
}
google.setOnLoadCallback(test_connection);
</script>
La documentación de la API de Google se puede encontrar here .
Esta pregunta ya tiene una respuesta aquí:
- ¿Detectar la conexión a internet está desconectada? 16 respuestas
¿Cómo verifica si hay conexión a internet usando Javascript? De esa manera podría tener algunos condicionales que digan "usar la versión de Google en caché de JQuery durante la producción, usar eso o una versión local durante el desarrollo, dependiendo de la conexión a Internet".
Escribí un plugin de jQuery para hacer esto. Por defecto, comprueba la URL actual (porque ya está cargada una vez desde la Web) o puede especificar una URL para usar como argumento. Hacer siempre una solicitud a Google no es la mejor idea porque está bloqueado en diferentes países en diferentes momentos. También podría estar a merced de cómo sería la conexión a través de un clima oceánico / clima / clima político particular ese día.
Ok, tal vez un poco tarde en el juego, pero ¿qué hay de verificar con una imagen en línea? Quiero decir, el OP necesita saber si necesita agarrar el CMD de Google o la copia de JQ local, pero eso no significa que el navegador no pueda leer Javascript, no importa qué, ¿verdad?
<script>
function doConnectFunction() {
// Grab the GOOGLE CMD
}
function doNotConnectFunction() {
// Grab the LOCAL JQ
}
var i = new Image();
i.onload = doConnectFunction;
i.onerror = doNotConnectFunction;
// CHANGE IMAGE URL TO ANY IMAGE YOU KNOW IS LIVE
i.src = ''http://gfx2.hotmail.com/mail/uxp/w4/m4/pr014/h/s7.png?d='' + escape(Date());
// escape(Date()) is necessary to override possibility of image coming from cache
</script>
Solo mis 2 centavos
Puede intentar enviando solicitudes XHR un par de veces, y luego, si recibe errores, significa que hay un problema con la conexión a Internet.
Edit: encontré este script JQuery que está haciendo lo que estás pidiendo, pero no lo probé.
Puedes imitar el comando ping.
Use Ajax para solicitar una marca de tiempo a su propio servidor, defina un temporizador usando setTimeout a 5 segundos, si no hay respuesta, intente nuevamente.
Si no hay respuesta en 4 intentos, puede suponer que Internet está caído.
Por lo tanto, puede verificar el uso de esta rutina en intervalos regulares como 1 o 3 minutos.
Eso me parece una solución buena y limpia.
Tengo una solución que trabaja aquí para verificar si existe conexión a internet:
$.ajax({
url: "http://www.google.com",
context: document.body,
error: function(jqXHR, exception) {
alert(''Offline'')
},
success: function() {
alert(''Online'')
}
})
Una solución mucho más simple:
<script language="javascript" src="http://maps.google.com/maps/api/js?v=3.2&sensor=false"></script>
y más tarde en el código:
var online;
// check whether this function works (online only)
try {
var x = google.maps.MapTypeId.TERRAIN;
online = true;
} catch (e) {
online = false;
}
console.log(online);
Cuando no esté en línea, el script de Google no se cargará, lo que generará un error en el que se emitirá una excepción.
5 años después de la versión:
Hoy en día, hay bibliotecas de JS para ti, si no quieres entrar en el meollo de los diferentes métodos descritos en esta página.
Uno de estos es https://github.com/hubspot/offline . Comprueba la conectividad de un URI predefinido, por defecto su favicon. Detecta automáticamente cuándo se ha restablecido la conectividad del usuario y proporciona eventos ordenados como up
y down
, a los que puede enlazar para actualizar su interfaz de usuario.
La mejor opción para su caso específico podría ser:
Justo antes de su etiqueta de cierre </body>
:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script>window.jQuery || document.write(''<script src="js/vendor/jquery-1.10.2.min.js"><//script>'')</script>
Esta es probablemente la forma más fácil dado que su problema se centra en jQuery.
Si quisieras una solución más robusta, puedes probar:
var online = navigator.onLine;
Lea más sobre las especificaciones del W3C en aplicaciones web fuera de línea , sin embargo, tenga en cuenta que esto funcionará mejor en los navegadores web modernos, ya que hacerlo con navegadores web más antiguos puede no funcionar como se espera o no funcionar.
Alternativamente, una solicitud XHR a su propio servidor no es un método tan malo para probar su conectividad. Si consideramos que una de las otras respuestas indica que hay demasiados puntos de falla para un XHR, si su XHR tiene fallas al establecer su conexión, también tendrá fallas durante el uso de rutina. Si no se puede acceder a su sitio por cualquier motivo, es probable que sus otros servicios que se ejecutan en los mismos servidores también sean inaccesibles. Esa decisión depende de usted.
No recomendaría hacer una solicitud de XHR al servicio de otra persona, incluso google.com para el caso. Haga la solicitud a su servidor, o no lo haga en absoluto.
¿Qué significa estar "en línea"?
Parece que hay cierta confusión sobre lo que significa estar "en línea". Tenga en cuenta que Internet es un conjunto de redes, sin embargo, a veces se encuentra en una red privada virtual (VPN), sin acceso a Internet "en general" ni a la red mundial. A menudo, las empresas tienen sus propias redes que tienen conectividad limitada a otras redes externas, por lo que podría considerarse "en línea". Estar en línea solo implica que está conectado a una red, no la disponibilidad ni la accesibilidad de los servicios a los que intenta conectarse.
Para determinar si un host es accesible desde su red, puede hacer esto:
function hostReachable() {
// Handle IE and more capable browsers
var xhr = new ( window.ActiveXObject || XMLHttpRequest )( "Microsoft.XMLHTTP" );
var status;
// Open new request as a HEAD to the root hostname with a random param to bust the cache
xhr.open( "HEAD", "//" + window.location.hostname + "/?rand=" + Math.floor((1 + Math.random()) * 0x10000), false );
// Issue request and handle response
try {
xhr.send();
return ( xhr.status >= 200 && (xhr.status < 300 || xhr.status === 304) );
} catch (error) {
return false;
}
}
También puede encontrar el Gist para eso aquí: https://gist.github.com/jpsilvashy/5725579
Detalles sobre la implementación local.
Algunas personas han comentado: "Siempre me devuelven falso". Eso es porque probablemente lo estés probando en tu servidor local. Sea cual sea el servidor al que lo solicites, deberás poder responder a la solicitud HEAD, que por supuesto puede cambiarse a un GET si lo deseas.