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>