javascript - 在Android WebView(Cordova)中检查互联网连接

我知道Stackoverflow中有很多与此有关的问题和答案，我读了很多，但都没有用。

我在标题android WebView中做了澄清，因为它是最重要的目标，但我希望它也可以在其他设备上使用。我在安装了Intel XDK的应用程序和安装了SM-G355M的Android 4.4.2的以及安装了Safari的iPhone 5C和iOS 9.3.4的true上测试了以下代码；

在这两种情况下，我得到的都是相同的false值(有时即使有Internet连接，我也会得到navigator.onLine)。

我试过了:

document.addEventListener("online", ...，它始终提供相同的值。

ajax不触发

Intel XDK不起作用，无论如何不会影响服务器吗？

代码: https://nanilab.com/stackoverflow/webview-internet-connection.php(此链接现在已断开)

选项1 :

function option1(){
    var isOffline = 'onLine' in navigator && !navigator.onLine,
        text = isOffline == true ? ' without connection ' : ' connected ';

    $('.option-one span').text(text);
    $('.option-one i').text('checked').hide().fadeIn(200);

    setTimeout(function(){
        option1();
    }, 1000);
}

选项2 :

window.addEventListener("offline", function(){ $('.option-two span').text(' without connection'); }, false);
window.addEventListener("online", function(){ $('.option-two span').text(' connected'); }, false);

选项3 :

function option3(){
    $.ajax({
        url: '/stackoverflow/blank.php',
        success: function(data){
            print(' connected ');
        },
        error: function(jqXHR, textStatus, error) {
            print(' without connection ');
        }
    });

    function print(text){
        $('.option-three span').text(text);
        $('.option-three i').text('checked').hide().fadeIn(200);

        setTimeout(function(){
            option3();
        }, 2000);
    }
}

使用在SM-G355M with Android 4.4.2上安装的ojit_code构建的应用程序

https://youtu.be/wHJHG5dP_eM

我做错了什么？

最佳答案

Apache Cordova (被称为PhoneGap)是一个开源 移动开发框架。它允许您使用标准 Web技术-HTML5，CSS3和JavaScript进行 cross-platform 开发。应用程序在针对每个平台的包装器中执行，并依赖于符合标准的API绑定(bind)来访问每个设备的功能，例如传感器，数据，网络状态等。
document reference cordova

在您的问题中(选项1):

navigator.onLine

…不起作用，因为(在android上)它损坏了(“原始”版本，启用了Cordova的webview不同)(如您所知)，您必须使用 WebView 来构建Cordova Framework应用程序。 Cordova的开发是正是来解决此问题。 PhoneGap中的GAP是“虚拟机”，“沙盒”与对硬件的访问之间的差距，和是跨平台的。

Android权限:
app/AndroidManifest.xml

<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.READ_PHONE_STATE" />

Cordova Permissions:
app/res/xml/config.xml

<feature name="NetworkStatus">
    <param name="android-package" value="org.apache.cordova.networkinformation.NetworkManager" />
</feature>

快速指南Cordova安装

转到网页以获取安装说明

https://cordova.apache.org/docs/en/latest/guide/cli/

转到网页并为您的系统下载nodejs

https://nodejs.org/en/download/

示例文件

node-v4.5.0-x86.msi

运行(安装)

success.

在Windows上:

C:\>npm install -g cordova

走开!

我已经将您的代码内置到cordova中，到了那里(希望是困难的问题)，这是到目前为止的图像[尚未完全在WebView中，{请参见第二张图像中的navigator.userAgent输出}](注意事件监听器正在工作； O)，但还不够好:o()。