检查Internet连接是否存在Javascript？

Question

如何使用Javascript检查互联网连接？这样，我可以有一些条件说“在生产过程中使用Google缓存的JQuery版本，在开发过程中使用该版本或本地版本，具体取决于Internet连接”。

Answer 1

针对您的特定情况的最佳选择可能是：

在您的结束</body>标记之前：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.10.2.min.js"><\/script>')</script>

鉴于您的问题集中在jQuery上，这可能是最简单的方法。

如果您想要一个更强大的解决方案，可以尝试：

var online = navigator.onLine;

阅读有关W3C在脱机Web应用程序上的规范的更多信息，但是请注意，这将在现代Web浏览器中最有效，使用较旧的Web浏览器可能无法按预期运行，或者根本无法运行。

另外，向您自己的服务器发出XHR请求并不是测试连接性的一种方法。考虑到其他答案之一表明，XHR的故障点太多，如果您的XHR在建立连接时有缺陷，那么无论如何在常规使用中也有缺陷。如果您的站点由于某种原因无法访问，则在同一服务器上运行的其他服务也可能无法访问。该决定由您决定。

我不建议对此人甚至向google.com提出XHR请求。向您的服务器发出请求，或者根本不发出请求。

“在线”意味着什么？

关于“在线”的含义似乎有些混乱。考虑互联网是一堆网络，但是有时您使用的是VPN，却无法访问“一般”互联网或万维网。公司通常都有自己的网络，这些网络与其他外部网络的连接受到限制，因此可以将您视为“在线”。正在网上只需要你连接到
一个 网络，你试图连接到服务的不可用性也可达性。

要确定主机是否可以从您的网络访问，可以执行以下操作：

function hostReachable() {

  // Handle IE and more capable browsers
  var xhr = new ( window.ActiveXObject || XMLHttpRequest )( "Microsoft.XMLHTTP" );

  // Open new request as a HEAD to the root hostname with a random param to bust the cache
  xhr.open( "HEAD", "//" + window.location.hostname + "/?rand=" + Math.floor((1 + Math.random()) * 0x10000), false );

  // Issue request and handle response
  try {
    xhr.send();
    return ( xhr.status >= 200 && (xhr.status < 300 || xhr.status === 304) );
  } catch (error) {
    return false;
  }

}

您也可以在此处找到要点：https：//gist.github.com/jpsilvashy/5725579

当地实施细节

有人评论说：“我总是被错误地送回”。那是因为您可能正在本地服务器上对其进行测试。无论您向哪个服务器发出请求，都需要能够响应HEAD请求，当然，如果需要，也可以将其更改为GET。