天天看點

Chrome navigator.onLine 問題

navigator.onLine可以簡單檢測本地用戶端是否線上。

使用方法。

var _navigatorIsOnline = navigator.onLine;
window.addEventListener("online", function() {
		_navigatorIsOnline = true;
	}, false);
	
	window.addEventListener("offline", function() {
		_navigatorIsOnline = false;
	}, false);
function netstat() {
		return _navigatorIsOnline;
	}
           

但是在Chrome32下會有一個bug

比如有2個html

window1.html和window2.html分别如下,

現象,當斷網後,在window1.html中點選new按鈕,該狀态立馬被改變。變為線上。但網絡并沒有連接配接上。

window1.html

<html manifest="main.manifest">
<head>
<script>
var child;
function newWin(e) {
	child = window.open("window2.html");
}
window.addEventListener("online", function(e) {
	console.log(e);
	console.log("online");
	alert("online")
}, false);

window.addEventListener("offline", function(e) {
	console.log(e);
	console.log("offline");
	alert("offline")
	e.stopPropagation();
}, false);
console.log(navigator.onLine)
navigator.onLine = false;


</script>
</head>

<input type=button value="New Window" οnclick="newWin(event);"/>
<a href="window2.html" target="_blank" rel="external nofollow"  target="_blank">New Window</a>
<html>
           

main.manifest

CACHE MANIFEST  
#VERSION ${version}
# 直接緩存的檔案  
CACHE:
window2.html
#需要在時刻線上的檔案  
NETWORK:  
*
# 替代方案  
FALLBACK:
           

window2.html

<body οnunlοad="test();">
<input type=text >
<span>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</span>
</body>
<script>
window.addEventListener("online", function() {
	console.log("online");
}, false);

window.addEventListener("offline", function() {
	console.log("offline");
}, false);
console.log(navigator.onLine)
</script>
           

繼續閱讀