检查Internet连接使用Javascript存在? [重复]

问题描述 投票:200回答:9

这个问题已经在这里有一个答案:

你如何检查是否有使用Javascript上网吗?这样我可以有一些条件语句说:“使用JQuery的谷歌缓存的版本在生产过程中,使用要么或开发过程中的本地版本,这取决于互联网连接”。

javascript jquery browser offline internet-connection
9个回答
258
投票

为您的特定情况下,最好的选择可能是:

右键你的亲密</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's spec on offline web apps,但是请注意,这最适合在现代浏览器,与旧的Web浏览器这样做不如预期,或者在所有可能无法正常工作。

另外,一个XHR请求你自己的服务器并不坏测试您的连接的方法。考虑到其他的答案的一个状态,有故障的点太多为XHR,如果建立它的连接,然后它会也无论如何日常使​​用过程中存在缺陷,当你XHR是有缺陷的。如果您的网站无法访问任何理由,那么在相同的服务器上运行的其他服务将可能是不可达也。这一决定是由你。

我不建议做一个XHR请求别人的服务,对于这个问题,甚至google.com。发出请求到服务器,或者根本没有。

这是什么意思是“在线”?

似乎有什么左右是“在线”的意思有些混乱。考虑到互联网是一群网络的,但是有时候你在一个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。


38
投票

好吧,也许有点晚了比赛,但讲的是一个在线图像检查什么?我的意思是,OP需要知道是否他需要抓住谷歌CMD或本地JQ副本,但这并不意味着浏览器无法读取的Javascript不管是什么,对不对?

<script>
function doConnectFunction() {
// Grab the GOOGLE CMD
}
function doNotConnectFunction() {
// Grab the LOCAL JQ
}

var i = new Image();
i.onload = doConnectFunction;
i.onerror = doNotConnectFunction;
// CHANGE IMAGE URL TO ANY IMAGE YOU KNOW IS LIVE
i.src = 'http://gfx2.hotmail.com/mail/uxp/w4/m4/pr014/h/s7.png?d=' + escape(Date());
// escape(Date()) is necessary to override possibility of image coming from cache
</script>

只是我的2美分


13
投票

5年以后的版本:

今天,有适合你的JS库,如果你不想要进入此页面上描述的不同方法的细节问题。

在这些是https://github.com/hubspot/offline。它检查预先定义的URI的连接,默认情况下你的图标。当用户的连接已经重新建立它会自动检测并提供整洁的事件,如updown,您可以以更新的用户界面结合。


5
投票

你可以模仿Ping命令。

使用Ajax请求时间戳自己的服务器,使用定义一个的setTimeout定时器为5秒,如果世界上没有响应它再试一次。

如果有在4次尝试没有反应,你可以假设网络已关闭。

所以,你可以检查定期像1或3分钟,同时使用这个程序。

这似乎对我来说是很好的和干净的解决方案。


1
投票

您可以尝试通过发送XHR请求了几下,然后如果你的错误就意味着有一个与互联网连接的问题。

编辑: 我发现this JQuery script这是做你问什么,我没有,虽然测试。


0
投票

我写了一个jQuery插件这样做。默认情况下,它会检查当前URL(因为这已经从网站加载一次),或者你可以指定一个URL作为参数来使用。总是在做谷歌的请求,因为它阻止在不同的国家在不同的时间是不是最好的主意。你也可能会在什么跨特定海洋/天气前/政治气候的连接可能会像这一天的怜悯。

http://tomriley.net/blog/archives/111


-3
投票

发送XHR请求是坏,因为如果特定服务器关闭它可能会失败。相反,使用网上搜寻API库加载的jQuery其缓存的版本(S)。

您可以使用谷歌API的jQuery加载后进行回调,这将检查的jQuery加载成功。像下面的代码的东西应该工作:

<script type="text/javascript">
    google.load("jquery");

    // Call this function when the page has been loaded
    function test_connection() {
        if($){
            //jQuery WAS loaded.
        } else {
            //jQuery failed to load.  Grab the local copy.
        }
    }
    google.setOnLoadCallback(test_connection);
</script>

在谷歌API文档可以发现here


-3
投票

我有谁在这里工作,检查互联网连接存在的解决方案:

$.ajax({
    url: "http://www.google.com",
    context: document.body,
    error: function(jqXHR, exception) {
        alert('Offline')
    },
    success: function() {
        alert('Online')
    }
})

-7
投票

一个更简单的解决方案:

<script language="javascript" src="http://maps.google.com/maps/api/js?v=3.2&sensor=false"></script>

而后面的代码:

var online;
// check whether this function works (online only)
try {
  var x = google.maps.MapTypeId.TERRAIN;
  online = true;
} catch (e) {
  online = false;
}
console.log(online);

如果不在线谷歌的脚本就不会被加载从而导致在一个会抛出异常的错误。

© www.soinside.com 2019 - 2024. All rights reserved.