javascriptで接続状況（オンラインかどうか）の確認方法を知りたい

rails+javascriptでチャットアプリを作成中です。
メッセージ投稿時に接続状況を確認する必要があり、どんな方法があるのか調べてみました。

window.navigator.onLine

を使う方法が一般的なのでしょうか？
こちらを使う情報が多く見つかりました。

ところが、以下の記事には「ブラウザにより挙動に違いあり、適さない」とありました。
JavaScriptでブラウザのインターネット接続を判定する方法

とりあえず3つの方法で試してみました。
いずれかの方法で判定ができればと思いました。
・window.navigator.onLine を使う方法
・XMLHttpRequest（XHR）を使う方法
・Fetch API を使う方法

javascript
1if (window.navigator.onLine) {
2  alert("wifi online");
3} else {
4  alert("wifi offline");
5}
6
7fetch("/favicon.ico")
8  .then(response => {
9    alert("fetch Ok");
10  })
11  .catch(error => {
12    alert("Network Error");
13  });
14  
15
16const xhr = new XMLHttpRequest();
17
18xhr.open("GET", "/favicon.ico");
19xhr.send();
20
21xhr.onload = () => {
22  alert("xhr Ok");
23};
24
25xhr.onerror = () => {
26  alert("Network Error");
27};
28

###確認したこと
PCとandorid携帯でwifiを入れた状態と切った状態で動作確認しました。
※pcの回線はusb子機による無線wifiのみ

PCでwifi onの状態で確認→
「wifi online」「fetch Ok」「xhrOk」と表示されました。

PCでwifi offの状態で確認→
「wifi offline」「fetch Ok」「xhrOk」と表示されました。

疑問１
あれ？wifi接続なくてもfetchやxhrは使える？？確認先が内側(/favicon.ico)だから？

さらに分からないのが、Androidの方です。
Androidではwifi on、offどちらでも
「wifi online」「fetch Ok」「xhrOk」と表示されました。

疑問２
なぜAndroidの方は、wifi切ってもオンラインになってるのでしょうか？
Androidバージョンは8.1.0、デバイスはOPPO AX7です。

ちなみに「機内モード」にしてアクセスすると、そもそも「オフラインです」
表示されalert以前にページが表示されません。

疑問３
どうすれば正しくオンラインかどうかの確認ができるのでしょうか？

分かる方教えていただけないでしょうか？
宜しくお願い致します。

行動規範の内容に同意します

回答1件

メッセージ投稿時に接続状況を確認する必要があり

「投稿して失敗したら、失敗した時に返すエラーコードから状態を判定する」ではだめなのでしょうか？

投稿2021/05/15 22:50

maisumakun

総合スコア145208

pecchan

2021/05/15 23:37

なるほど！その発想はなかったです！それは以下のようなイメージでしょうか？ $.ajax({ //省略 success: function(res) { if (res.is_success) { } else { // ここでエラー判定するということ } } }); 現状、メッセージ送信部分がjavascriptからではなく、 viewからPOST送信してます。 <form action="/messages" data-remote="true" method="post"> このような場合は、 >失敗した時に返すエラーコードから状態を判定するはどこで行うのでしょうか？コントローラでしょうか？ビューでしょうか？