在浏览器中检测互联网连接状态

大家好👋

在本文中，我们将学习如何检测我们网站的互联网连接状态。

当浏览器无法连接到互联网时，通过显示快餐消息或弹出窗口，这可以非常有用地改善用户体验。

执行

我们可以使用来获取连接的当前状态window.navigator.onLine，它将返回一个boolean值。

• true如果已连接。
• false如果没有连接。

const online = window.navigator.onLine;
if (online) {
  // Is connected to internet
} else {
  // Not connected to internet
}

如果浏览器不支持，window.navigator.onLine上述示例将始终显示为false或undefined。

连接状态改变监听器

我们还可以通过监听网络状态改变事件（即online和）来检测连接状态offline。

window.addEventListener('offline', function(e) {
    // Network disconnected
  }
);

window.addEventListener('online', function(e) {
    // Network connected
  }
);

它很容易实现，但在某些情况下可能会产生假阳性结果。

• 计算机已连接到移动热点，但移动互联网不工作，那么您也可以获取online状态。

• 计算机正在运行虚拟化软件，该软件具有始终“连接”的虚拟以太网适配器。

最初发表于blog.bibekkakati.me

感谢您的阅读🙏

如果您喜欢这篇文章或觉得它有帮助，请点赞👍

欢迎随时联系👋

Twitter | Instagram | LinkedIn

如果你喜欢我的作品并想支持它，可以在这里留言。我会非常感激。