Jak wykryć połączenie internetowe w JavaScript w trybie offline?
javascript
ajax
offline
connectivity
internet-connection
Daniel Silveira
źródło
źródło
Odpowiedzi:
Możesz ustalić, że połączenie zostało utracone, wykonując nieudane żądania XHR .
Standardowym podejściem jest ponowienie próby kilka razy. Jeśli nie przejdzie, powiadom użytkownika, aby sprawdził połączenie i z wdziękiem się nie powiedzie .
Sidenote: Ustawienie całej aplikacji w trybie „offline” może prowadzić do wielu podatnych na błędy prac związanych z obsługą stanu. Połączenia bezprzewodowe mogą przychodzić i odchodzić itp. Dlatego najlepszym rozwiązaniem może być po prostu wdzięczne niepowodzenie, zachowanie dane i powiadom użytkownika, pozwalając mu ostatecznie rozwiązać problem z połączeniem, jeśli taki istnieje, i kontynuować korzystanie z aplikacji z dużą dozą przebaczenia.
Sidenote: Możesz sprawdzić wiarygodną witrynę, taką jak Google, pod kątem łączności, ale może to nie być całkiem przydatne, jak próba złożenia własnego żądania, ponieważ chociaż Google może być dostępny, Twoja aplikacja może nie być, a nadal będziesz poradzić sobie z własnym problemem z połączeniem Próba wysłania polecenia ping do Google byłaby dobrym sposobem na potwierdzenie, że samo połączenie internetowe jest niedostępne, więc jeśli ta informacja jest dla Ciebie przydatna, być może warto.
Sidenote : Wysłanie Pinga można osiągnąć w taki sam sposób, jak w przypadku dowolnego dwukierunkowego żądania ajax, ale w tym przypadku wysłanie pinga do Google stanowiłoby pewne wyzwanie. Po pierwsze, mielibyśmy te same problemy między domenami, które zwykle występują przy tworzeniu komunikacji Ajax. Jedną z opcji jest skonfigurowanie serwera proxy po stronie serwera, w którym faktycznie
ping
google (lub jakakolwiek inna strona) i zwracamy wyniki ping do aplikacji. To jest catch-22ponieważ jeśli połączenie internetowe stanowi problem, nie będziemy w stanie uzyskać dostępu do serwera, a jeśli problem z połączeniem dotyczy tylko naszej własnej domeny, nie będziemy w stanie stwierdzić różnicy. Można wypróbować inne techniki między domenami, na przykład osadzenie iframe na stronie, która wskazuje na google.com, a następnie sondowanie iframe pod kątem sukcesu / niepowodzenia (sprawdź zawartość itp.). Osadzanie obrazu może nam niewiele powiedzieć, ponieważ potrzebujemy użytecznej odpowiedzi od mechanizmu komunikacji, aby wyciągnąć dobre wnioski na temat tego, co się dzieje. Zatem ponownie określenie stanu połączenia internetowego jako całości może być większym problemem niż jest to warte. Będziesz musiał rozważyć te opcje dla konkretnej aplikacji.źródło
IE 8 będzie obsługiwał window.navigator.onLine właściwość .
Ale to oczywiście nie pomaga w przypadku innych przeglądarek lub systemów operacyjnych. Przewiduję, że inni dostawcy przeglądarek również zdecydują się na udostępnienie tej właściwości, biorąc pod uwagę znaczenie znajomości statusu online / offline w aplikacjach Ajax.
Dopóki to nie nastąpi, albo XHR lub
Image()
lub<img>
żądanie może zapewnić coś zbliżonego do pożądanej funkcjonalności.Aktualizacja (2014/11/16)
Duże przeglądarki obsługują teraz tę właściwość, ale wyniki będą się różnić.
Cytat z dokumentacji Mozilli :
źródło
Prawie wszystkie główne przeglądarki obsługują teraz tę
window.navigator.onLine
właściwość, a odpowiednie zdarzenia oknaonline
ioffline
:Spróbuj ustawić system lub przeglądarkę w trybie offline / online i sprawdź konsolę lub
window.navigator.onLine
właściwość pod kątem zmian wartości. Możesz to również przetestować na tej stronie .Zwróć jednak uwagę na ten cytat z Dokumentacji Mozilli :
(nacisk jest mój)
Oznacza to, że jeśli
window.navigator.onLine
jestfalse
(lub dostanieszoffline
zdarzenie), masz gwarancję, że nie masz połączenia z Internetem.Jeśli tak jest
true
(lub dostanieszonline
zdarzenie), oznacza to, że system jest w najlepszym razie podłączony do jakiejś sieci. Nie oznacza to na przykład, że masz dostęp do Internetu. Aby to sprawdzić, nadal będziesz musiał skorzystać z jednego z rozwiązań opisanych w innych odpowiedziach.Początkowo zamierzałem opublikować to jako aktualizację odpowiedzi Granta Wagnera , ale wydawało się to zbyt dużą edycją, zwłaszcza biorąc pod uwagę, że aktualizacja 2014 nie była już od niego .
źródło
Można to zrobić na kilka sposobów:
Możesz umieścić
onerror
wimg
, jakTa metoda mogłaby również zawieść, jeśli obraz źródłowy został przeniesiony / zmieniono jego nazwę, i ogólnie byłby gorszym wyborem niż opcja ajax.
Istnieje więc kilka różnych sposobów na wykrycie tego, żaden z nich nie jest idealny, ale przy braku możliwości wyskoczenia z piaskownicy przeglądarki i uzyskania bezpośredniego dostępu do stanu połączenia sieciowego użytkownika, wydają się być najlepszymi opcjami.
źródło
źródło
Interfejs API pamięci podręcznej aplikacji HTML5 określa navigator.onLine, który jest obecnie dostępny w wersjach beta IE8, nightlies WebKit (np. Safari) i jest już obsługiwany w Firefox 3
źródło
Można użyć $ .ajax () „s
error
zwrotna, która pożary, jeżeli żądanie nie powiedzie się. JeślitextStatus
jest równy ciągowi „limit czasu”, prawdopodobnie oznacza to, że połączenie zostało zerwane:Z dokumentu :
Na przykład:
źródło
Jak powiedział olliej, korzystanie z
navigator.onLine
właściwości przeglądarki jest lepsze niż wysyłanie żądań sieciowych i, zgodnie z developer.mozilla.org/En/Online_and_offline_events , jest nawet obsługiwane przez starsze wersje Firefox i IE.Ostatnio WHATWG określiło dodanie zdarzeń
online
ioffline
, na wypadek, gdybyś musiał zareagować nanavigator.onLine
zmiany.Proszę również zwrócić uwagę na link opublikowany przez Daniela Silveirę, który wskazuje, że poleganie na tych sygnałach / właściwościach do synchronizacji z serwerem nie zawsze jest dobrym pomysłem.
źródło
to jest to, czego szukasz, ale tutaj jest kilka rzeczy, które należy dodać, jeśli chcesz coś sprawdzić w swojej aplikacji (na przykład sprawdzić, czy użytkownik nagle przejdzie w tryb offline, co w tym przypadku jest poprawne przez większość czasu) trzeba także posłuchać zmiany), aby dodać detektor zdarzeń do okna w celu wykrycia każdej zmiany, aby sprawdzić, czy użytkownik przejdzie w tryb offline, możesz:
i do sprawdzenia, czy online:
źródło
onLine
. Przeglądarki definiują stan bycia online bardzo różnie. Zajrzyj na developer.mozilla.org/en-US/docs/Web/API/NavigatorOnLine/onLine .Musiałem stworzyć aplikację internetową (opartą na ajax) dla klienta, który dużo współpracuje ze szkołami, szkoły te często mają złe połączenie internetowe. Używam tej prostej funkcji do wykrycia, czy istnieje połączenie, działa bardzo dobrze!
Używam CodeIgniter i Jquery:
źródło
wywołanie ajax do Twojej domeny jest najprostszym sposobem na wykrycie, czy jesteś offline
tylko po to, aby dać ci koncepcję, należy ją ulepszyć.
Np. Błąd = 404 powinien nadal oznaczać, że jesteś online
źródło
Myślę, że to bardzo prosty sposób.
źródło
if the browser is not able to connect to a local area network (LAN) or a router, it is offline; all other conditions return true
Szukałem rozwiązania po stronie klienta, aby wykryć, czy Internet nie działa lub czy mój serwer nie działa. Inne rozwiązania, które zawsze znajdowałem, wydawały się zależeć od pliku skryptu lub obrazu innej firmy, co nie wydawało mi się, żeby wytrzymało próbę czasu. Zewnętrzny hostowany skrypt lub obraz może w przyszłości ulec zmianie i spowodować awarię kodu wykrywającego.
Znalazłem sposób, aby to wykryć, szukając xhrStatus z kodem 404. Ponadto używam JSONP do ominięcia ograniczenia CORS. Kod stanu inny niż 404 pokazuje, że połączenie internetowe nie działa.
źródło
Moja droga.
źródło
Problem niektórych metod, takich jak
navigator.onLine
to, że nie są one kompatybilne z niektórymi przeglądarkami i wersjami mobilnymi, opcja, która bardzo mi pomogła, to użycie klasycznejXMLHttpRequest
metody, a także przewidzenie możliwego przypadku, że plik był przechowywany w pamięci podręcznej z odpowiedziąXMLHttpRequest.status
większą niż 200 i mniej niż 304.Oto mój kod:
źródło
Istnieją dwie odpowiedzi dla dwóch różnych senariów: -
Jeśli używasz JavaScript na stronie internetowej (tj; lub jakiejkolwiek części front-end) Najprostszym sposobem na to jest:
Ale jeśli używasz js po stronie serwera (tj. Węzła itp.), Możesz ustalić, że połączenie zostało zerwane przez wykonanie nieudanych żądań XHR.
Standardowym podejściem jest ponowienie próby kilka razy. Jeśli nie przejdzie, powiadom użytkownika, aby sprawdził połączenie i z wdziękiem się nie powiedzie.
źródło
błąd żądania żądania
źródło
Oto fragment narzędzia pomocniczego, które mam. To jest javascript z przestrzenią nazw:
Powinieneś używać tego z wykrywaniem metod, w przeciwnym razie uruchom „alternatywny” sposób na wykonanie tego. Zbliża się czas, kiedy będzie to wszystko, czego potrzeba. Inne metody to hacki.
źródło