インターネット接続がオフラインかどうかを検出しますか? 質問する

Question

ほぼすべての主要ブラウザ今サポートするwindow.navigator.onLineプロパティと、対応するonlineウィンドウofflineイベント。次のコードスニペットを実行してテストします。

console.log('Initially ' + (window.navigator.onLine ? 'on' : 'off') + 'line');

window.addEventListener('online', () => console.log('Became online'));
window.addEventListener('offline', () => console.log('Became offline'));

document.getElementById('statusCheck').addEventListener('click', () => console.log('window.navigator.onLine is ' + window.navigator.onLine));

<button id="statusCheck">Click to check the <tt>window.navigator.onLine</tt> property</button><br /><br />
Check the console below for results:

システムまたはブラウザをオフライン/オンラインモードに設定し、ログまたはwindow.navigator.onLineプロパティで値の変更を確認してください。

しかし、この引用文に注目してくださいMozilla ドキュメント:

Chrome と Safari では、ブラウザがローカルエリアネットワーク (LAN) またはルーターに接続できない場合はオフラインになります。その他の条件ではが返されますtrue。したがって、ブラウザがfalse値を返した場合にはオフラインであると想定できますが、値が必ずしもブラウザがインターネットにアクセスできることを意味するとは想定できませんtrue。常に「接続」された仮想イーサネットアダプタを持つ仮想化ソフトウェアをコンピュータが実行している場合など、誤検知が発生する可能性があります。したがって、ブラウザのオンライン状態を本当に判断したい場合は、確認するための追加の手段を開発する必要があります。

Firefox と Internet Explorer では、ブラウザをオフラインモードに切り替えるとfalse値が送信されます。Firefox 41 までは、他のすべての条件で値が返されます。Firefox true41 以降、OS X および Windows では、値は実際のネットワーク接続に従います。

（強調は私によるものです）

つまり、イベントwindow.navigator.onLineが発生した場合false（またはofflineイベントが発生した場合）、インターネットに接続できないことが保証されます。

ただし、接続されている場合true（またはonlineイベントが発生した場合）は、せいぜいシステムが何らかのネットワークに接続されていることを意味するだけです。たとえば、インターネットにアクセスできることを意味するわけではありません。これを確認するには、他の回答に記載されている解決策のいずれかを使用する必要があります。

_{当初はこれをアップデートとして投稿するつもりでしたグラント・ワグナーの回答、しかし、2014年のアップデートがすでに行われていたことを考えると、編集が多すぎるように思えた。彼からではない。}

Answer 1