检查互联网连接的最佳方法是什么

时间:2014-02-26 19:54:50

标签: javascript php jquery mysql ajax

我制作了一个CMS,在操作过程中会提取大量数据。 CMS由PHP,MySQL,jQuery,Bootstrap和使用AJAX构成。

问题是如果丢失了互联网连接,可能会导致显示和滚动出现问题。

我很乐意,如果有一个很好的方法来显示错误并在没有互联网连接时阻止网站上的所有功能。建立连接后,它应该是站点上允许的所有功能。

谢谢!

(抱歉我的英语不好。)

3 个答案:

答案 0 :(得分:3)

如果您正在使用jQuery,则只需挂钩global error handler并在发生错误时锁定您的应用程序。锁定屏幕可能只是要求再试一次。

$( document ).ajaxError(function() {
  // lock your UI here
});

此外,一旦UI被锁定,您就可以执行一个以Exponential Backoff方式ping服务器的功能,并在网络恢复时自动解锁应用程序。

使用jQuery的blockUI插件可以轻松锁定您的应用。

实施例

(function ($) {
  var locked = false;
  var errorRetryCount = 0;
  var blockUiOptions = { message: "Oops! Could not reach the server!" };

  // change this function to adjust the exponential backoff delay
  function backoff(n) {
    return Math.pow(2, n) * 100;
  }

  $(function () {
    $( document ).ajaxError(function () {
      var req = this;

      errorRetryCount += 1;

      if (!locked) {
         locked = true;
         $.blockUI(blockUiOptions);
      }

      // retry to send the request...
      setTimeout(function () { $.ajax(req); }, backoff(errorRetryCount));
    }).ajaxSuccess(function () {
      locked && $.unblockUI();
      locked = false;
      errorRetryCount = 0;
    });
  });
})(jQuery);

注意:您可能不希望在网络出现故障时无限期地重试您的请求,并希望在某个时候退出重试。由于这超出了这个问题的范围,我会保持原样。但是,您可以查看this related question,这可能有助于您对此部分进行排序。

答案 1 :(得分:2)

如果你已经使用了jQuery,你可以为你的服务器创建一个简单的ajax调用,如果它在几秒钟内失败,你的服务器或客户端互联网连接都会关闭。

这样的事情:

setInterval(function() {
  $.ajax({
    url: "https://cms.example.com/ping",
  })
  .fail(function( data ) {
    alert('Connection lost?');
    // remember do to something smart which shows the error just once
    // instead of every five seconds. Increasing the interval every 
    // time it fails seems a good start.
  });
}, 5*1000);

答案 2 :(得分:0)

编辑:重新阅读你的问题并误解了我的第一次通过,所以这对连续监控无效......但我会留在这里,因为它可能对其他人有用。

我建议加载一个小的js文件,将一个类添加到页面的一个元素,然后检查该类是否在事后应用...假设你使用的是jQuery

通过脚本标记

在jQuery之后加载到页面中的远程服务器上的

文件

$('html').addClass('connected');

本地代码

if($('html').hasClass('connected')) {
    // connected
} else {
    // not connected
}