检查 Phonegap 应用程序连接

Question

我在 Phonegap 中做一个非本地应用程序，我想知道我什么时候有连接。在 WEB 上搜索，我找到了一种方法来知道我是否在我的应用程序中获得了连接，但是我在我的代码中实现了并且没有工作。

我找到的方法是这样的：

document.addEventListener("deviceready", onDeviceReady, false);  

        // PhoneGap is loaded and it is now safe to make calls PhoneGap methods  
        function onDeviceReady() {  
            check_my_Connection();  
        }  

        function check_my_Connection() {  
            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]);  
        }  

我在脚本的ready 函数中调用函数onDeviceReady()，如下所示：

<script type="text/javascript">

     $(document).ready(function(){
          /*other code*/
          onDeviceReady();
         /*other chode*/
     });

     /*other code functions*/
     /*Before the rest of the code, I added the snippet code above of this*/

     document.addEventListener("deviceready", onDeviceReady, false); 
     ...
</script>

我读到我需要cordova.js，但PhoneGap Desktop App（测试版）没有创建它。这个JS文件需要做这个工作吗？是否存在不使用 jQueryUI 或 jQueryMobile 来检测 Phonegap 应用程序中的连接的另一种方法？我需要对项目的某些文件进行一些更改吗？

我将不胜感激任何帮助或任何方式来做到这一点。

P。 S.：对不起我的英语。

Answer 1

问题必须在您的代码中。只需执行以下操作即可接收连接状态：

1. 打开您的终端/控制台
2. cordova create networkInformation com.example.com networkInformation
3. cd networkInformation
4. cordova platform add android
5. cordova plugin add cordova-plugin-network-information
6. cordova build

完成此过程后，您将在桌面上打开创建的文件夹。在platform 内的www 文件夹内移动-> assets 下的android 文件夹内。打开你的 index.js，它应该是这样的：

/*
 * Licensed to the Apache Software Foundation (ASF) under one
 * or more contributor license agreements.  See the NOTICE file
 * distributed with this work for additional information
 * regarding copyright ownership.  The ASF licenses this file
 * to you under the Apache License, Version 2.0 (the
 * "License"); you may not use this file except in compliance
 * with the License.  You may obtain a copy of the License at
 *
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing,
 * software distributed under the License is distributed on an
 * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
 * KIND, either express or implied.  See the License for the
 * specific language governing permissions and limitations
 * under the License.
 */
var app = {
    // Application Constructor
    initialize: function() {
        this.bindEvents();
    },
    // Bind Event Listeners
    //
    // Bind any events that are required on startup. Common events are:
    // 'load', 'deviceready', 'offline', and 'online'.
    bindEvents: function() {
        document.addEventListener('deviceready', this.onDeviceReady, false);
    },
    // deviceready Event Handler
    //
    // The scope of 'this' is the event. In order to call the 'receivedEvent'
    // function, we must explicitly call 'app.receivedEvent(...);'
    onDeviceReady: function() {
        app.receivedEvent('deviceready');
    },
    // Update DOM on a Received Event
    receivedEvent: function(id) {
        var parentElement = document.getElementById(id);
        var listeningElement = parentElement.querySelector('.listening');
        var receivedElement = parentElement.querySelector('.received');

        listeningElement.setAttribute('style', 'display:none;');
        receivedElement.setAttribute('style', 'display:block;');

        console.log('Received Event: ' + id);
    }

};

app.initialize();

所以现在寻找

onDeviceReady: function() {
    app.receivedEvent('deviceready');
},

把它改成这样：

onDeviceReady: function() {
    app.receivedEvent('deviceready');
    checkConnection();
},

同时添加

function checkConnection() {
    var networkState = navigator.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.CELL]     = 'Cell generic connection';
    states[Connection.NONE]     = 'No network connection';

    alert('Connection type: ' + states[networkState]);
}

直接在app.initialize();上方

那么这应该是您的完整 index.js。只需启动您的应用程序，它就会提醒您网络状态：

/*
 * Licensed to the Apache Software Foundation (ASF) under one
 * or more contributor license agreements.  See the NOTICE file
 * distributed with this work for additional information
 * regarding copyright ownership.  The ASF licenses this file
 * to you under the Apache License, Version 2.0 (the
 * "License"); you may not use this file except in compliance
 * with the License.  You may obtain a copy of the License at
 *
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing,
 * software distributed under the License is distributed on an
 * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
 * KIND, either express or implied.  See the License for the
 * specific language governing permissions and limitations
 * under the License.
 */
var app = {
    // Application Constructor
    initialize: function() {
        this.bindEvents();
    },
    // Bind Event Listeners
    //
    // Bind any events that are required on startup. Common events are:
    // 'load', 'deviceready', 'offline', and 'online'.
    bindEvents: function() {
        document.addEventListener('deviceready', this.onDeviceReady, false);
    },
    // deviceready Event Handler
    //
    // The scope of 'this' is the event. In order to call the 'receivedEvent'
    // function, we must explicitly call 'app.receivedEvent(...);'
    onDeviceReady: function() {
        app.receivedEvent('deviceready');
        checkConnection();
    },
    // Update DOM on a Received Event
    receivedEvent: function(id) {
        var parentElement = document.getElementById(id);
        var listeningElement = parentElement.querySelector('.listening');
        var receivedElement = parentElement.querySelector('.received');

        listeningElement.setAttribute('style', 'display:none;');
        receivedElement.setAttribute('style', 'display:block;');

        console.log('Received Event: ' + id);
    }

};

function checkConnection() {
    var networkState = navigator.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.CELL]     = 'Cell generic connection';
    states[Connection.NONE]     = 'No network connection';

    alert('Connection type: ' + states[networkState]);
}


app.initialize();