javascript判斷機器是否聯網的2種方法

2019-11-20 22:25:42

字體：大中小

來源：轉載

供稿：網友

在很多場景下，只有機器已經聯網以后，web應用才能啟動。如果沒有聯網，就會提示錯誤。、
但是機器有時候要重啟。如果機器重啟后，立刻啟動web應用的話，可能，機器上的網絡服務還沒有準備好。

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

方法一：
navigator.onLine

復制代碼代碼如下:

 
if (navigator.onLine) 
{ //正常工作} 
else { //執行離線狀態時的任務} 

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

方法二：
當然，如果想支持的更兼容，可以使用如下2個事件：online和offline。當網絡從離線變為在線或者從在線變為離線時，分別觸發這兩個事件。這兩個事件在window對象上觸發。
為了檢測應用是否離線，在頁面加載后，最好先通過navigator.onLine取得初始的狀態。然后，就是通過上述兩個事件來確定網絡連接狀態是否變化。當上述事件觸發式，navigator.onLine屬性的值也會改變，不過必須要手工輪詢這個屬性才能檢測到網絡狀態的變化。

復制代碼代碼如下:

 
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"); 
}); 