在JS中检查互联网连接的最快方法

Quickest way to check internet connectivity in JS

本文关键字：方法 连接 互联网 JS 检查      更新时间：2023-09-26

我在检查连接的 html 文件中有此代码，但这里的问题是抛出警报消息框以指示连接丢失大约需要 10 秒。我想知道是否有一种更快的方法来通知用户连接丢失而无需等待。严格 JS 谢谢...

JS代码：

<script language="JavaScript">
function SubmitButton()
{
    if(navigator.onLine)
    {
            document.getElementById('SubmitBtn').style.visibility='visible';
    }
    else
    {
        document.getElementById('SubmitBtn').style.visibility='hidden';
    }
}
function Online() 
{ 
    var status=false;
    status= navigator.onLine;
    if(status!= true)
    {
        alert('Network connectivity is lost, please try again later');
    }
}
</script>

在这里的 html 文件中调用它：

<INPUT name="ccMCA1input" type="checkbox" onclick="ccMCA1.ccEvaluate(),Online()" value=False>

您可以定期从（纽约）服务器请求 1x1 gif 图像，确保使用缓存克星方法以避免缓存。您可以使用加载和错误事件。

var isOnline = (function isOnline(){
  // Create a closure to enclose some repeating data
  var state = false;
  var src = 'gif_url?t=' + Date.now();
  var function onLoad = function(){state = true;}
  var function onError = function(){state = false;}
  // Inside the closure, we create our monitor
  var timer = setInterval(function(){
    var img = new Image();
    img.onload = onLoad;
    img.onerror = onError;
    img.src = src;
  }, 10000);
  // Return a function that when called, returns the state in the closure
  return function(){return state;};
}());
//Use as
var amIOnline = isOnline();

navigator.onLine是唯一可以检查的内置属性（顺便说一句，它不可靠）。
您可以创建对可靠服务器的 XHR 请求，并检查是否收到任何响应。

考虑查看以下网址：

  1. 在线连接监控
  2. navigator.onLine 测试
  3. 在线/离线事件捕获
相关文章：