Question

我正在使用Phonegap。我需要定期检查网络连接。实际上我从服务器获取一些数据。如果没有连接，我需要显示错误提示。

我用Google搜索并找到了解决方案。但它不行。因为我需要定期检查连接。

<html>
  <head>
    <title>navigator.network.connection.type Example</title>
    <script type="text/javascript" charset="utf-8" src="phonegap-1.0.0.js"></script>
    <script type="text/javascript" charset="utf-8">
    // Wait for PhoneGap to load
    document.addEventListener("deviceready", onDeviceReady, false);
    function onDeviceReady() {
        checkConnection();
    }

    function checkConnection() {
        var networkState = navigator.network.connection.type;
        var states = {};
        states[Connection.UNKNOWN]  = 'Unknown connection';
        states[Connection.ETHERNET] = 'Ethernet connection';
        states[Connection.WIFI]     = 'WiFi connection';
        states[Connection.CELL_2G]  = 'Cell 2G connection';
        states[Connection.CELL_3G]  = 'Cell 3G connection';
        states[Connection.CELL_4G]  = 'Cell 4G connection';
        states[Connection.NONE]     = 'No network connection';
        alert('Connection type: ' + states[networkState]);
    }
    </script>
  </head>
  <body>
    <p>A dialog box will report the network state.</p>
  </body>
</html>

仅在应用程序启动时第一次检查。但我需要定期检查它，因为我正在进行套接字编程。如果互联网出现问题，我需要展示它。但此代码仅在发布时显示。

Answer 1

工作示例：http://jsfiddle.net/Gajotres/d5XYR/

使用间隔计时器每隔预定义时间检查互联网连接。此解决方案需要HTML5浏览器，但这不是问题，因为jQuery Mobile已经需要HTML5浏览器。在这种情况下，计时器将每100毫秒检查一次互联网连接，并将最终结果设置为javascript全局变量。

一切都取决于这一行：

window.navigator.onLine -- it will be false if the user is offline.

最终解决方案：

var connectionStatus = false;

$(document).on('pagebeforeshow', '#index', function () {
    setInterval(function () {
        connectionStatus = navigator.onLine ? 'online' : 'offline';
    }, 100);
    $(document).on('click', '#check-connection', function () {
        alert(connectionStatus);
    });
});

经过测试：

Windows Firefox
Windows Google Chrome
Windows IE9和IE10
Android 4.1.1 Chrome
iPad 3 Safari
iPad3 Chrome

Answer 2

也许您可以使用文档上的“在线”和“离线”事件监听器，以便在应用程序联机或脱机时通知您的应用程序，如文档中所述。在这里：http://docs.phonegap.com/en/3.2.0/cordova_events_events.md.html#online

Answer 3

不幸的是，Chrome和Safari以及多种移动浏览器的答案都不稳定。它不会给你“真正的互联网连接”状态，而是“网络连接状态”。参见：

https://developer.mozilla.org/en-US/docs/Web/API/window.navigator.onLine

“在Chrome和Safari中，如果浏览器无法连接到局域网（LAN）或路由器，则它处于脱机状态;所有其他条件都返回true。因此，您可以认为浏览器处于脱机状态时它返回一个假值，你不能认为真值必然意味着浏览器可以访问互联网。你可能会得到误报，例如在计算机运行虚拟化软件的情况下，虚拟化软件总是具有虚拟的以太网适配器“连接。”因此，如果您真的想确定浏览器的在线状态，您应该开发其他方法进行检查。要了解更多信息，请参阅HTML5 Rocks文章，网格工作。“

请参阅此HTML5 Rocks文章，了解真正稳定的解决方案 - 当然还有更多工作：

http://www.html5rocks.com/en/mobile/workingoffthegrid/

Answer 4

尝试此代码，

<script>
        $(document).ready(function () {
            document.addEventListener("deviceready", onDeviceReady, false);
            document.addEventListener("online", onOnline, false);
            document.addEventListener("offline", onOffline, false);

        function onDeviceReady() {
            //onDeviceReaddy
        }

        function onOnline() {
            //onOnline
        }

        function onOffline() {
            navigator.notification.alert(
                'Please Check your internet connection.', // message
                null, // callback
                'AllCare Doctor', // title
                'OK' // buttonName
            );
        }

 </script>

有关更多详细信息，请单击Here..!

如何定期检查Phonegap中的互联网连接？

4 个答案: