インターネットアクセスのJavaScript検出の実装コード_JavaScriptスキル

最も単純かつ大雑把な方法は、ネットワーク リソース、JS ファイル、または画像ファイルをロードすることです。

コードをコピーします コードは次のとおりです:

6dddce404d2473986ddcc092820e5ecc2cacc6d41bbb37262a98f745aa00fbf0
typeof window.jQuery === "未定義" // false または true を返します

jQuery 変数を使用して、インターネットに接続されているかどうかを検出します

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

ネットワーク リソースの読み込みに関する問題は、インターネットの検出です。LAN の検出の場合は、何もできません。
現時点では、より良い解決策が必要なので、navigator.onLine を使用する必要があります。この属性の欠点は、Chrome と Safari がすべて完全にサポートしており、IE7 以降がサポートされていることです。 Firefox と IE6 はさらに悲惨で、ブラウザが「オフライン」の場合にのみ false を返し、それ以外の場合は true を返します。ネットワーク ケーブルが挟まれている場合でも同様ですが、Opera ではサポートされなくなりました。

そこで、互換性メソッドを追加する必要があります。http ヘッダー リクエストを location.hostname アドレスに送信します。コードは次のとおりです。

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

注意すべき点の 1 つは、open メソッドの 3 番目のパラメータには false を渡す必要があり、それは同期リクエストである必要があるということです。

概要: ブラウザが navigator.onLine をサポートしている場合は、navigator.onLine を使用します。サポートしていない場合は、http ヘッダー リクエストを送信します。

元の記事、転載する場合は明記してください: フロントエンド開発

から転載