Implementierungscode für die Javascript-Erkennung von Internetzugang_Javascript-Kenntnissen

Der einfachste und einfachste Weg ist das Laden von Netzwerkressourcen, JS-Dateien oder Bilddateien.

Code kopieren Der Code lautet wie folgt:

typeof window.jQuery === „undefiniert“ // false oder true zurückgeben

Verwenden Sie jQuery-Variablen, um zu erkennen, ob Sie mit dem Internet verbunden sind

function doConnectFunction() {
  return true;
}
function doNotConnectFunction() {
  return false;
}

 var i = new Image();
i.onload = doConnectFunction;
i.onerror = doNotConnectFunction;
i.src = 'http://su.bdimg.com/static/superplus/img/logo_white.png?d=' + escape(Date());

Das Problem beim Laden von Netzwerkressourcen ist die Erkennung des Internets. Wenn es sich um eine LAN-Erkennung handelt, können Sie nichts tun.
Zu diesem Zeitpunkt benötigen wir eine bessere Lösung, daher müssen wir navigator.onLine verwenden. Der Nachteil dieses Attributs besteht darin, dass es perfekt mit den Browsern Chrome und Safari kompatibel ist und IE7 und höher unterstützt wird. Firefox und IE6 sind bemitleidenswerter. Sie geben nur dann „false“ zurück, wenn der Browser „offline“ ist, andernfalls geben sie „true“ zurück. Dies gilt auch dann, wenn das Netzwerkkabel eingeklemmt ist, Opera unterstützt dies jedoch nicht mehr.

Also müssen wir eine Kompatibilitätsmethode hinzufügen: Senden Sie eine HTTP-Header-Anfrage an die Adresse „location.hostname“. Der Code lautet wie folgt:

var xhr = new ( window.ActiveXObject || XMLHttpRequest )( "Microsoft.XMLHTTP" );
var status;
xhr.open( "HEAD", "//" + window.location.hostname + "/?rand=" + Math.floor((1 + Math.random()) * 0x10000), false );
 try {
  xhr.send();
  return ( xhr.status >= 200 && xhr.status < 300 || xhr.status === 304 );
 } catch (error) {
  return false;
 }

Zu beachten ist, dass der dritte Parameter der open-Methode als false übergeben werden muss und es sich um eine synchrone Anfrage handeln muss.

Zusammenfassung: Wenn der Browser navigator.onLine unterstützt, verwenden Sie navigator.onLine. Wenn er dies nicht unterstützt, senden Sie eine HTTP-Header-Anfrage.

Originalartikel, bitte beim Nachdruck angeben: Nachdruck aus Front-End-Entwicklung