Online status
ブラウザーのオンライン状態を返します。このプロパティは、オンラインを意味する true とオフラインを意味する false の論理値を返します。このプロパティは、ブラウザーのネットワークへの接続状態が変化するたびに更新を送信します。更新は、ユーザーがリンクをたどったときや、スクリプトがリモートページを要求したときに発生します。例えば、ユーザーがインターネット接続を失った直後にリンクをクリックした場合、このプロパティは false を返します。
このプロパティの実装は、ブラウザーにより異なります。
Chrome および Safari は、ブラウザーがローカルエリアネットワーク (LAN) またはルーターに接続できないときにオフライン、それ以外の状況では true を返します。従って、false 値が返る場合はブラウザーがオフラインであると考えることができますが、true 値は必ずインターネットにアクセスできると考えることはできません。仮想イーサネットアダプタを持つ仮想化ソフトウェアを実行しているコンピューターでは常に「接続中」になるなど、誤検出になる可能性があります。よって、本当にブラウザーのオンラインである状態を検出したい場合は、チェックするための追加の手段を開発する必要があります。
Firefox では、ブラウザーをオフラインモードに切り替えると、 false 値が送信されます。 Firefox 41 までは、それ以外の条件では true 値が返されます。 Windows の Nightly 68 で実際の動作を確認したところ、 Chrome や Safari のように LAN 接続のみを確認しているため、誤検出が発生していました。
online および offline イベントを待ち受けすることにより、ネットワーク接続状態の変化を確認することができます。
対応ブラウザ
| 機能 | デスクトップ | モバイル | ||||
|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Chrome Android | Safari iOS | |
| 2 | 12 | 1.5 | 4 | 18 | 3.2 | |
| offline は Window インターフェイスのイベントで、ブラウザーがネットワークへのアクセスを失い、 Navigator.onLine の値が false に切り替わったときに発行されます。 | 3 | 12 | 9 | 4 | 18 | 3 |
| online は Window インターフェイスのイベントで、ブラウザーがネットワークにアクセスできるようになり、 Navigator.onLine の値が true に切り替わると発行されます。 | 3 | 12 | 9 | 4 | 18 | 3 |
| offline は WorkerGlobalScope のイベントで、端末がインターネットへの接続を失ったときに発行されます。 | | | 29 | 8 | | 8 |
| online は WorkerGlobalScope のイベントで、端末がインターネットに再接続したときに発行されます。 | | | 29 | 8 | | 8 |
| ブラウザーのオンライン状態を返します。このプロパティは論理値を返し、 true はオンラインを意味し、 false はオフラインを意味します。このプロパティは、ブラウザーがネットワークに接続する能力が変化するたびに、更新を送信します。更新は、ユーザーがリンクをたどったときや、スクリプトがリモートページをリクエストしたときに発生します。 | 4 | 12 | 3.5 | 4 | 18 | 5 |
- 以前のバージョンのChromeでは、タブが最初に開かれた際に誤って`true`が返されていましたが、最初のネットワークイベントが発生した後は正しい接続状態が報告されるようになります。Windows: 11、macOS: 14、ChromeOS: 13、Linux: 常に`true`を返します。経緯については、バグ40530968を参照してください。
- Firefox 4 以降、実際のネットワーク接続状況にかかわらず、ブラウザは「オフラインで作業」モードが無効のときは `true` を、有効のときは `false` を返します。Firefox 41 以降、OS X および Windows では、「オフラインで作業」モードが選択されていない限り(選択されている場合は常に `false` を返します)、返される値は実際のネットワーク接続状況に基づきます。
- Firefox 4 以降、実際のネットワーク接続状況にかかわらず、ブラウザは「オフラインで作業」モードが無効のときは `true` を、有効のときは `false` を返します。Firefox 41 以降、OS X および Windows では、「オフラインで作業」モードが選択されていない限り(選択されている場合は常に `false` を返します)、返される値は実際のネットワーク接続状況に基づきます。
実務での使いどころ
-
Online status の活用
ブラウザーのオンライン状態を返します。
注意点
- 古いブラウザでは対応していない場合がある。
実装メモ
- 一部の API はセキュアコンテキスト (HTTPS) やユーザー操作起点を必要とする。利用前に要件を確認すること。