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

2019-11-20 22:25:42

字體：大中小

供稿：網(wǎng)友

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

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

方法一：
navigator.onLine

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

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

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

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