Verifica se la connessione Internet esiste con Javascript?

Come si controlla se esiste una connessione Internet che utilizza Javascript? In questo modo potrei avere alcuni condizionali che dicono “usa la versione cache di Google di JQuery durante la produzione, usa quella o una versione locale durante lo sviluppo, a seconda della connessione internet“.

L’opzione migliore per il tuo caso specifico potrebbe essere:

Subito prima del tuo :

   

Questo è probabilmente il modo più semplice dato che il tuo problema è centrato su jQuery.

Se volessi una soluzione più robusta potresti provare:

 var online = navigator.onLine; 

Maggiori informazioni sulle specifiche del W3C sulle app web offline , tuttavia tieni presente che ciò funzionerà al meglio nei browser Web moderni, in questo modo i browser Web meno recenti potrebbero non funzionare come previsto o non funzionare affatto.

In alternativa, una richiesta XHR al tuo server non è un cattivo metodo per testare la tua connettività. Considerando una delle altre risposte si afferma che ci sono troppi punti di errore per un XHR, se il tuo XHR è difettoso quando si stabilisce la sua connessione allora sarà comunque difettoso durante l'uso di routine. Se il tuo sito è irraggiungibile per qualsiasi motivo, anche gli altri servizi in esecuzione sugli stessi server saranno probabilmente irraggiungibili. Questa decisione spetta a te.

Non consiglierei di fare una richiesta XHR al servizio di qualcun altro, anche google.com. Fai la richiesta al tuo server, o non farlo affatto.

Cosa significa essere "online"?

Sembra che ci sia una certa confusione su cosa significhi "online". Considera che Internet è un insieme di reti, tuttavia a volte sei su una VPN, senza accesso a Internet "at-large" o al world wide web. Spesso le aziende hanno le proprie reti che hanno una connettività limitata ad altre reti esterne, pertanto si potrebbe essere considerati "online". Essere online implica solo che si è connessi a una rete, non alla disponibilità né alla raggiungibilità dei servizi a cui si sta tentando di connettersi.

Per determinare se un host è raggiungibile dalla tua rete, puoi farlo:

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

Puoi trovare il Gist anche qui: https://gist.github.com/jpsilvashy/5725579

Dettagli sull'implementazione locale

Alcune persone hanno commentato: "Sono sempre stato restituito falso". Questo perché probabilmente lo stai testando sul tuo server locale. Qualunque sia il server a cui stai facendo la richiesta, dovrai essere in grado di rispondere alla richiesta HEAD, che ovviamente può essere modificata in GET, se lo desideri.

Ok, forse un po ‘in ritardo nel gioco ma per quanto riguarda il controllo con un’immagine online? Voglio dire, l’OP deve sapere se ha bisogno di prendere la CMD di Google o la copia locale di JQ, ma ciò non significa che il browser non può leggere Javascript, non importa cosa, giusto?

  

Solo i miei 2 centesimi

5 anni dopo: versione:

Oggi, ci sono librerie JS per te, se non vuoi entrare nel nocciolo duro dei diversi metodi descritti in questa pagina.

Su questi è https://github.com/hubspot/offline . Controlla la connettività di un URI predefinito, di default il tuo favicon. Rileva automaticamente quando la connettività dell’utente è stata ristabilita e fornisce eventi accurati come up e down , che è ansible associare per aggiornare l’interfaccia utente.

Puoi imitare il comando Ping.

Usa Ajax per richiedere un timestamp al tuo server, definisci un timer usando setTimeout a 5 secondi, se non c’è nessuna risposta prova di nuovo.

Se non ci sono risposte in 4 tentativi, si può supporre che internet sia inattivo.

Quindi è ansible verificare l’utilizzo di questa routine a intervalli regolari come 1 o 3 minuti.

Sembra una soluzione buona e pulita per me.

Puoi provare inviando alcune richieste XHR alcune volte, e se ricevi errori significa che c’è un problema con la connessione Internet.

Modifica: ho trovato questo script JQuery che sta facendo quello che stai chiedendo, ma non l’ho provato.

Ho scritto un plugin jQuery per farlo. Per impostazione predefinita controlla l’URL corrente (perché è già caricato una volta dal Web) oppure è ansible specificare un URL da utilizzare come argomento. Fare sempre una richiesta a Google non è l’idea migliore perché è bloccata in paesi diversi in momentjs diversi. Inoltre potresti essere in balia di quale potrebbe essere la connessione tra un particolare oceano / meteo e il clima politico di quel giorno.

http://tomriley.net/blog/archives/111

L’invio di richieste XHR è errato perché potrebbe non riuscire se quel particolare server non funziona. Invece, utilizza la libreria API googles per caricare le versioni della cache di jQuery.

Puoi utilizzare l’API googles per eseguire una richiamata dopo aver caricato jQuery e questo controllerà se jQuery è stato caricato correttamente. Qualcosa come il seguente codice dovrebbe funzionare:

  

La documentazione dell’API di google può essere trovata qui .

Ho una soluzione che lavora qui per verificare se esiste una connessione internet:

 $.ajax({ url: "http://www.google.com", context: document.body, error: function(jqXHR, exception) { alert('Offline') }, success: function() { alert('Online') } }) 

Una soluzione molto più semplice:

  

e più avanti nel codice:

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

Quando non è online, lo script di google non verrà caricato, causando un errore in cui verrà generata un’eccezione.