ajaxでインターネットに接続しているかどうかを確認する方法

Question

知っている方がいたら教えてください。

ローカルホスト（127.0.0.1）で動くWebがあります。
このWebの中で、あるボタンを押したとき、
外部（インターネット環境）のWebページにアクセスする際に、
ネットワークに接続しているかどうかを判別したいです。

正確には、インターネットに接続されている場合は、
外部Webページからjsonpを返して処理したい

〇接続済み
→そのままjsonpのダウンロード
〇未接続
→「インターネットに接続してください」のアラート

困っているのが、このPC環境がProxyサーバを経由しているために、
外部のURLにアクセスしようとすると、ProxyのID、PWを求められ、
入力しないと外部にアクセスできない点です。
なので、非同期通信が使えません。
（使えるかもしれませんが、やり方がわからず。。。）
（同期通信しないと、ID,PW入力中に処理が先に進んで、
常に「インターネットに接続してください」になってしまう）

通常は外部アクセスはオフラインですが、
ProxyのID,PWを入力することによってオンラインに切り替わります。

このような環境で、インターネット接続済みかどうかを
判別する方法はありますでしょうか。

よろしくお願いいたします。

追伸です。

同期通信で処理をした場合、インターネットに接続していない場合は、
timeoutが使えません。
$.ajax({
timeout: 3000,
async: false
});
の場合は、3秒でタイムアウトしないです。

追記です。

ちなみに、書きそびれて申し訳ないです。
利用ブラウザは、Firefox ver.38 になります。

追記です。

利用しているjQueryのバージョンは
jquery-1.11.1.min.js
になります。

Comments

[oikashinoa]

ajaxで試しているソースを出したほうがいいと思います。(非同期、同期ともに)

[mcncx]

ご指摘ありがとうございます。ひとまず解決しましたので後ほど出します。

[m.ts10806]

解決したようで良かったのですがコメントからしても私の回答では解決に至れていないように思います。自身で回答を書き、自己解決としてはいかがでしょうか

[m.ts10806]

ベストアンサーは移せたはずなのでそちらも。

Answer 1

おそらく非同期を利用する方が簡単です。

※以下は最近のjQuery を前提にしています

$.ajax({
  timeout:3000,
  url: 'http://teratail.com'
})
.catch(function(err){
  alert('インターネットに接続してください。');
});

Comments

[mcncx]

こちら返信遅くなり申し訳ありません。
昨日1日検証しましたが、うまくいきませんでした。

使っているjQueryのバージョンだと思いますが、
catchプロパティがエラーになります。
こちらも後出しで申し訳ありません。
jQuery ver 1.11.1になります

他の設定も含めて再度検証してみます。

Answer 2

非同期通信だと、どうしてもProxyのID,PWがクリアできませんでしたので、
同期通信で確認することにしました。

以下、私の取った方法です。

function isConnectNetwork(){
	return $.ajax({
		type     : "get",
		url      : "https://hogehoge.com/ping.php",
		timeout  : 2000,
		async    : false
	}).responseJSON;
}

function onCheckNewVersion(){
	var json = isConnectNetwork();
	if( json == undefined || !json.result ){
		alert("インターネットに接続してください");
		return false;
	}
	（何か処理）
}

また、jsonpを使うと、なぜかうまくタイムアウトできなかったので、
jsonpはあきらめました。

ひとまず、上記だとうまく動きました。
皆様ありがとうございました。

Answer 3

重複投稿したので削除します

Answer 4

困っているのが、このPC環境がProxyサーバを経由しているために、

外部のURLにアクセスしようとすると、ProxyのID、PWを求められ、
入力しないと外部にアクセスできない点です。

この点を解決するのも手かと思います。解決しておかないと、なにかと詰まるのでは…？

Comments

[mcncx]

Proxyはマストなので、ここはこの仕様で変えられません。
申し訳ないです。よろしくお願いいたします。

[退会済みユーザー]

いえ、Proxyがあっても非同期通信できるようにしたほうがいいのでは？と。同期通信ならできる、というのも気になるところですし。

[mcncx]

なるほど。同期通信ではなく、非同期通信の線で、
と言うことですね！
ありがとうございます。こちらで更に検証してみます！

Answer 5

navigator.onLineでは満たせませんか？

Comments

[mcncx]

はい。navigator.onLineでは、ローカルホストに接続しているためか、
常にtrueが返ります。

ちなみに、書きそびれて申し訳ないです。
利用ブラウザは、Firefox ver.38 になります。

[m.ts10806]

んー。
私が以前関わった案件ではローカルサーバーであっても、例えばWiFi切ったりLAN線抜いたりでオフラインになりましたけど、状況がよくわかりませんね。

追記は質問本文にお願いします

[mcncx]

なるほど。もう一度検証してみます。
本文追記、かしこまりました。
ご教授ありがとうございます。

[R.Mizukami]

WANに接続できない状況でも LANの中までは常にオンラインなら、常に true は妥当な動作だと思います。
また、firefox 41 までは、ブラウザをオフラインモードにしない限り true らしいです。
[https://developer.mozilla.org/en-US/docs/Web/API/NavigatorOnLine/onLine](MDN)

[m.ts10806]

補足ありがとうございます。

[mcncx]

検証結果、やっぱり常に true でした。
補足もありがとうございました。