使用jquery检查Internet连接

时间:2013-11-18 08:31:17

标签: javascript jquery jquery-deferred

我正在尝试通过向服务器发送GET请求来检查互联网连接。我是jquery和javascript的初学者。我没有将navigator.onLine用于我的代码,因为它在不同的浏览器中的工作方式不同。到目前为止,这是我的代码:

var check_connectivity={
        is_internet_connected : function(){
            var dfd = new $.Deferred();
            $.get("/app/check_connectivity/")
            .done(function(resp){
                return dfd.resolve();
            })
            .fail(function(resp){
                return dfd.reject(resp);
            })
            return dfd.promise();
        },
}

我将此代码称为不同的文件:

if(!this.internet_connected())
        {
            console.log("internet not connected");
            //Perform actions
        }
internet_connected : function(){
        return check_connectivity.is_internet_connected();
},

is_internet_connected()函数返回一个延迟对象,而我只需要一个真/假的答案。谁能告诉我如何实现这个目标?

7 个答案:

答案 0 :(得分:9)

$.get()返回一个jqXHR对象,该对象是promise兼容的 - 因此无需创建自己的$.Deferred

var check_connectivity = {
    ...
    is_internet_connected: function() {
        return $.get({
            url: "/app/check_connectivity/",
            dataType: 'text',
            cache: false
        });
    },
    ...
};

然后:

check_connectivity.is_internet_connected().done(function() {
    //The resource is accessible - you are **probably** online.
}).fail(function(jqXHR, textStatus, errorThrown) {
    //Something went wrong. Test textStatus/errorThrown to find out what. You may be offline.
});

正如您所看到的,无法确定您是在线还是离线。所有javascript / jQuery都知道资源是否被成功访问。

通常,了解资源是否成功访问(以及响应是否很酷)比了解您的在线状态本身更有用。每个ajax调用都可以(并且应该)拥有自己的.done().fail()分支,允许采取适当的操作,无论请求的结果如何。

答案 1 :(得分:3)

您是否要检查互联网连接是否已连接?

如果是这样,试试这个:

$.ajax({
    url: "url.php",
    timeout: 10000,
    error: function(jqXHR) { 
        if(jqXHR.status==0) {
            alert(" fail to connect, please check your connection settings");
        }
    },
    success: function() {
        alert(" your connection is alright!");
    }
});

答案 2 :(得分:1)

你不能得到简单的真或假,给他们一个回调处理程序

function is_internet_connected(callbackhandler)
{
$.get({
  url: "/app/check_connectivity/",
  success: function(){
     callbackhandler(true);
  },
  error: function(){
     callbackhandler(false);
  },
  dataType: 'text'
});
}

答案 3 :(得分:1)

try this 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>
 if (! window.jQuery) {
 alert('No internet Connection !!');
  }
 else {
 // internet connected
 }

Jquery Plugin for Detecting Internet Connection

答案 4 :(得分:1)

100%工作:

function checkconnection() {
    var status = navigator.onLine;
    if (status) {
        alert('Internet connected !!');
    } else {
        alert('No internet Connection !!');
    }
}

答案 5 :(得分:1)

这段代码将继续监视互联网连接 单击下面的“运行代码段”按钮,然后查看其运行情况。

function checkInternetConnection(){
        var status = navigator.onLine;
        if (status) {
            console.log('Internet Available !!');
        } else {
            console.log('No internet Available !!');
        }  
        setTimeout(function() {
            checkInternetConnection();
        }, 1000);
      }

//calling above function
checkInternetConnection();

答案 6 :(得分:0)

根据W3C http://www.w3schools.com/jsref/prop_nav_online.asp

,我只使用导航器onLine属性

但导航器只告诉我们浏览器是否具有互联网功能(连接到路由器,3G等)。 因此,如果返回false,则您可能处于脱机状态,但如果返回true,则在网络中断或非常慢的情况下仍可以脱机。 这是检查XHR请求的时间。

setInterval(setOnlineStatus(navigator.onLine), 10000);

function setOnlineStatus(online)
{
    if (online) {
    //Check host reachable only if connected to Router/Wifi/3G...etc
        if (hostReachable())
            $('#onlineStatus').html('ONLINE').removeAttr('class').addClass('online');
        else
            $('#onlineStatus').html('OFFLINE').removeAttr('class').addClass('offline');
    } else {
        $('#onlineStatus').html('OFFLINE').removeAttr('class').addClass('offline');
    }
}

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

    // 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;
    }

}

编辑:如果端口号不是80,则使用端口号,否则失败。

xhr.open("HEAD", "//" + window.location.hostname + ":" + window.location.port + "/?rand=" + Math.floor((1 + Math.random()) * 0x10000), false);