javascript - 在JavaScript中检测浏览器的在线状态

Question

我在移动设备和 Linux 上测试了以下代码，它正确报告了在线状态更改。

<script>
    function updateOnlineStatus(event) {      
      onlineStatusIndicator.innerHTML = navigator.onLine ? 'online' : 'offline';
    }
    window.addEventListener('online', updateOnlineStatus);
    window.addEventListener('offline', updateOnlineStatus);
    document.addEventListener('DOMContentLoaded', () => {      
      var onlineStatusIndicator = document.querySelector(
        '#onlineStatusIndicator'
      );
      updateOnlineStatus();
    });
</script>

当我在 Windows 10 上使用以下适配器时，单独关闭 WiFi 适配器不会报告离线状态。我还必须关闭 vEthernet(默认交换机)和 vEthernet(Docker/NAT)才能获得预期的行为。

因此，如果 hyper-v 已打开，我们就不能依赖 wifi 连接更改来检测在线/离线状态，除非我们也在 vEthernet 适配器上执行相同的连接更改。这是正确的吗？

Answer 1

只要浏览器连接网络的能力发生变化，Navigator.onLine 属性就会发送更新。当用户点击链接或脚本请求远程页面时，就会发生更新。例如，当用户在失去互联网连接后不久单击链接时，该属性应返回 false。

浏览器以不同的方式实现此属性。

在 Chrome 和 Safari 中，如果浏览器无法连接到局域网 (LAN) 或路由器，则表示浏览器处于离线状态；所有其他条件返回 true。因此，虽然您可以假设浏览器在返回 false 值时处于离线状态，但您不能假设 true 值一定意味着浏览器可以访问互联网。您可能会收到误报，例如计算机运行的虚拟化软件具有始终“连接”的虚拟以太网适配器。因此，如果你真的想确定浏览器的在线状态，你应该开发额外的手段来检查。

在 Firefox 和 Internet Explorer 中，将浏览器切换到离线模式会发送错误值。在 Firefox 41 之前，所有其他条件都返回真值；在 Windows 上的 Nightly 68 上测试实际行为表明，它只查找 LAN 连接，如 Chrome 和 Safari 给出误报。

引用:

Navigator.onLine