检查网络连接已连接/已断开

Check network connection connected/disconnected

本文关键字:连接 断开 网络 检查      更新时间:2023-09-26

我正在使用java/servlet和前端JSP开发一个Web应用程序。

我的页面为用户显示一些信息。

是否有任何适当的方法来检查网络连接是否处于活动状态(开/关)以及是否支持所有浏览器和设备?

如果网络出现故障,我想重定向到带有适当消息的其他页面。

我读过有关使用该navigator.onLine的信息,但并非所有浏览器都支持它,有时它也会产生错误的结果。

在大多数浏览器中都有一个本机属性: navigator.onLine ,但是目前它的实现因浏览器而异,因此很难在任何现实世界中使用。

考虑到这一点,我使用以下 javascript 函数来检查我的页面是否与 Web 连接。它非常简单,应该跨浏览器工作。它的工作原理是尝试从服务器加载图像并捕获发生的任何错误:

var isOnline = true;
function onlineCheck(){
    var testImg = new Image(); 
    testImg.onerror = function(){
        isOnline = false
        alert("Web access is unavailable. Please check that you are connected to the internet.")
    }
    testImg.onload = function(){ isOnline = true; }
    testImg.src = "https://www.google.ie/images/srpr/logo4w.png"; //replace this with an image on your site
}
最好将

网站上的testImg.src更改为 1x1 像素的图像。这将更快地加载,因为与您的域的连接可能已经打开。我通常为此目的使用动态生成的图像,因为我发现实现几行代码比创建和上传真实图像更容易。以防万一你想尝试这个,我已经包含了我用来制作 1x1 像素图像的 PHP 代码。您可以轻松地将其适应 JSP:

        header(  "Content-type:  image/gif"); 
        header("Cache-Control: no-cache"); 
        header("Cache-Control: must-revalidate"); 
        printf ("%c%c%c%c%c%c%c%c%c%c%c%c%c%c%c%c%c%c%c%c%c%c%c%c%c%c%c%c%c%c%c%c%c%c%c%c%c%c%c%c%c%c%c",71,73,70,56,57,97,1,0,1,0,128,255,0,192,192,192,0,0,0,33,249,4,1,0,0,0,0,44,0,0,0,0,1,0,1,0,0,2,2,68,1,0,59);
        exit(); 

判断 Web 应用是否具有工作连接的唯一 TRUE 方法是调用远程服务并等待响应。如果请求失败或超时,则可以假定没有连接。

导航器API的问题在于它只会告诉您设备是否连接到第一级,无论是路由器还是LAN等,而不是真正连接到互联网。

很简单,类似于以下内容的内容就可以解决问题......

var appConnected = false;
function checkConnection() {
    var xmlHttp = new XMLHttpRequest();
    xmlHttp.timeout = 1000 //Miliseconds - Set this to whatever you feel appropriate for your app
    xmlHttp.open('GET', 'http://yourdomain.com/1x1.gif', true);
    xmlHttp.onreadystatechange = function () {
        switch (xmlHttp.readyState) {
            case 4:
                var r = xmlHttp.responseText;
                if ( xmlHttp.status === 200 )  {
                    appConnected = true;
                } else {
                    appConnected = false;
                }
                break;
            default:
                appConnected = false;
        }
    };
}
var intervalID = window.setInterval(checkConnection, 5000);

这将每 5 秒运行一次 - 根据您的特定用例,这可能不是那么高效。请记住考虑您的用户数据和带宽。

轮询连接状态后,清除间隔...

clearInterval(nIntervId);

您的另一种选择是可能使用 HTML5 应用程序缓存中的回退选项 - 尽管如果您面向较旧的设备,这可能是不可能的。