背景

最近在用Electron開發(fā)一款應用，其中有涉及到檢測因特網(wǎng)是否斷開的需求。Electron基于Chromium和Node.js，讓你可以使用HTML、CSS和JavaScript構(gòu)建應用。所以Electron提供nodejs、瀏覽器兩套運行環(huán)境。

筆者最先考慮到的方案HTML5提供的online/offline網(wǎng)絡連接事件。

window.addEventListener('online', ...)
window.addEventListener('offline', ...)

結(jié)論很失望，這兩個網(wǎng)絡連接事件，只是檢測本地網(wǎng)絡連接狀態(tài)。

既然瀏覽器沒有提供檢測因特網(wǎng)是否斷開的接口，筆者只能在nodejs尋求答案。

調(diào)研

說到nodejs，筆者最先想到是去npm倉庫搜索現(xiàn)有的庫。找到了兩款檢測因特網(wǎng)狀態(tài)的庫internet-available、is-online

internet-available

這個庫檢測因特網(wǎng)連接狀態(tài)原理，是檢測dns連接狀態(tài)。

這里大家肯定有個疑問，使用nodejs原生模塊dns不是更簡潔嗎？

你說的沒錯，nodejs確實提供這樣的方法，但是dns原生模塊并沒有提供超時檢測。internet-available可以設置超時參數(shù)，默認是5000ms（依賴dns-socket庫實現(xiàn)dns超時，有興趣可以研究其源碼，這里不做展開）。

internet-available使用舉例：

var internetAvailable = require("internet-available");

internetAvailable().then(function(){
 console.log("Internet available");
}).catch(function(){
 console.log("No internet");
});

如果想加入檢測次數(shù)和每次檢測超時時間，代碼如下：

var internetAvailable = require("internet-available");

internetAvailable({
 timeout: 4000,
 retries: 10,
}).then(function(){
 console.log("Internet available");
}).catch(function(){
 console.log("No internet");
});

internet-available默認檢測的DNS域名是google.com，如果想自定義域名，代碼如下：

var internetAvailable = require("internet-available");

internetAvailable({
 domainName: "xxxxx.com",
 port: 53,
 host: '8.8.8.8' // 默認，國內(nèi)請改成114.114.114.114
}).then(() => {
 console.log("Internet available");
}).catch(() => {
 console.log("No internet");
});

備注：8.8.8.8是谷歌公司提供的免費DNS服務器，該地址是全球通用，相對來說，更適合國外以及訪問國外網(wǎng)站的用戶使用，國內(nèi)更適合用114.114.114.114。

is-online

is-online與internet-available檢測方式相同，唯一區(qū)別是is-online可以在nodejs和瀏覽器環(huán)境同時運行。在瀏覽器環(huán)境下，通過navigator.onLine返回網(wǎng)絡連接狀態(tài)，但與HTML5 online、offline事件一樣，只能檢測本地連接。

is-online使用舉例

const isOnline = require('is-online');
 
isOnline().then(online => {
 if(online){
 console.log("We have internet");
 }else{
 console.log("Houston we have a problem");
 }
});

此庫也提供超時設置，且可以設置Internet協(xié)議版本，這是一個通常不需要設置的高級選項，但它對于專門斷言IPv6連接非常有用，代碼如下：

var isOnline = require('is-online');
 
isOnline({
 timeout: 5000,
 version: "v4" // v4 or v6
}).then(online => {
 if(online){
 console.log("Internet available");
 }else{
 console.log("No internet");
 }
});

總結(jié)

除了以上兩個庫，還有其他方式可以檢測因特網(wǎng)斷開嗎？筆者目前想到的還可以通過發(fā)起http head請求是否成功響應判斷；通過ping 目標host或者domain是否連通檢測判斷。如果有更好的方式，歡迎討論~

好了，以上就是這篇文章的全部內(nèi)容了，希望本文的內(nèi)容對大家的學習或者工作具有一定的參考學習價值，謝謝大家對腳本之家的支持。