快捷導(dǎo)航

javascript判斷機(jī)器是否聯(lián)網(wǎng)的2種方法

更新時(shí)間：2013年08月09日 16:12:39 作者：

只有機(jī)器已經(jīng)聯(lián)網(wǎng)以后，web應(yīng)用才能啟動(dòng)，下面使用javascript判斷機(jī)器是否聯(lián)網(wǎng)，具體判斷代碼如下，有此需求的朋友可以參考下

在很多場(chǎng)景下，只有機(jī)器已經(jīng)聯(lián)網(wǎng)以后，web應(yīng)用才能啟動(dòng)。如果沒有聯(lián)網(wǎng)，就會(huì)提示錯(cuò)誤。、
但是機(jī)器有時(shí)候要重啟。如果機(jī)器重啟后，立刻啟動(dòng)web應(yīng)用的話，可能，機(jī)器上的網(wǎng)絡(luò)服務(wù)還沒有準(zhǔn)備好。

特別是windows7，啟動(dòng)網(wǎng)絡(luò)服務(wù)需要好幾秒，這個(gè)時(shí)候怎么辦呢？
之前嘗試過幾種方法：
比如通過ping來判斷，但是ping需要有一個(gè)非本機(jī)的ip地址。這個(gè)不是很通用
比如監(jiān)控某個(gè)端口是否已經(jīng)被占用，但是光端口占用，也不能說明網(wǎng)絡(luò)已經(jīng)啟動(dòng)了。
另一個(gè)方面，如果是web應(yīng)用的話，最好是在前端判斷，比如用javascript。
網(wǎng)上也有人寫 javascript 的ping的模擬效果。但確實(shí)有些麻煩。
怎么辦呢，關(guān)鍵的時(shí)候，還是html5能給出好的解決方法：

方法一：
navigator.onLine

復(fù)制代碼代碼如下:

 
if (navigator.onLine) 
{ //正常工作} 
else { //執(zhí)行離線狀態(tài)時(shí)的任務(wù)} 

這個(gè)html5的 navigator的新特性可以很簡單幫我們搞定
HTML5為此定義了一個(gè)navigator.onLine屬性，這個(gè)屬性值為true表示設(shè)備能上網(wǎng)，值為false表示設(shè)備離線。
當(dāng)然不同的瀏覽器，對(duì)這個(gè)的支持還不太一樣
IE6+和Safari 5+支持的比較好
Firefox 3+和支持navigator.onLine屬性，但你必須手工選中菜單項(xiàng)“文件-Web開發(fā)人員（設(shè)置）-脫機(jī)工作”才能讓瀏覽器正常的工作。
Chrome需要12以上。

方法二：
當(dāng)然，如果想支持的更兼容，可以使用如下2個(gè)事件：online和offline。當(dāng)網(wǎng)絡(luò)從離線變?yōu)樵诰€或者從在線變?yōu)殡x線時(shí)，分別觸發(fā)這兩個(gè)事件。這兩個(gè)事件在window對(duì)象上觸發(fā)。
為了檢測(cè)應(yīng)用是否離線，在頁面加載后，最好先通過navigator.onLine取得初始的狀態(tài)。然后，就是通過上述兩個(gè)事件來確定網(wǎng)絡(luò)連接狀態(tài)是否變化。當(dāng)上述事件觸發(fā)式，navigator.onLine屬性的值也會(huì)改變，不過必須要手工輪詢這個(gè)屬性才能檢測(cè)到網(wǎng)絡(luò)狀態(tài)的變化。

復(fù)制代碼代碼如下:

 
var EventUtil = { 
addHandler: function (element, type, handler) { 
if (element.addEventListener) { 
element.addEventListener(type, handler, false); 
} else if (element.attachEvent) { 
element.attachEvent("on" + type, handler); 
} else { 
element["on" + type] = handler; 
} 
} 
}; 
EventUtil.addHandler(window, "online", function () { 
alert("Online"); 
}); 
EventUtil.addHandler(window, "offline", function () { 
alert("Offline"); 
}); 