Ionic:使用 Cordova 检查 Internet 连接 [英] Ionic: Check Internet Connection using Cordova

问题描述

我正在研究 Ionic 框架，并在使用 Apache Cordova Network API 用于检测 Android 应用程序中的互联网连接.我参考了 this 教程并创建了一个演示项目，效果很好.

I am working on Ionic Framework, and facing issues using the Apache Cordova Network API to detect internet connection in Android App. I have referred this tutorial and also created a demo project, which works fine.

我已按照以下步骤操作.[来自教程]

I have followed the below steps. [from the tutorial]

1. ionic start testApp sidemenu

ionic平台添加android

打开testApp/www/js/app.js

复制粘贴此代码

if(window.Connection) {

  if(navigator.connection.type == Connection.NONE) {
      alert('There is no internet connection available');
  }else{
      alert(navigator.connection.type);
  }
}else{
      alert('Cannot find Window.Connection');
}

安装 Cordova 插件 cordova 插件添加 org.apache.cordova.network-information

构建 ionic build android

运行 ionic run android

这很好用

问题

1. 将 www 从 mainproject 复制到 testApp 并执行第 6 步和第 7 步

1. Copy Paste www from mainproject to testApp and do steps 6 and 7

我收到警报 无法找到 Window.Connection

之后复制粘贴app.js看起来像这样

.run(function($ionicPlatform) {
  $ionicPlatform.ready(function() {
    // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
    // for form inputs)
    if(window.cordova && window.cordova.plugins.Keyboard) {
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
    }
    if(window.StatusBar) {
      // org.apache.cordova.statusbar required
      StatusBar.styleDefault();
    }
    // check internet connection
    //alert(window.Connection);
    alert('Hi')
    try {
       alert('Naviagtor says'+navigator.connection.type);
     }
    catch(err) {
       alert( 'Error '+ err.message) 
       //here i get 'Error cannot read property type of undefined'
     }

if(window.Connection) {
    if(navigator.connection.type == Connection.NONE) {
        alert('There is no internet connection available');
    }else{
        alert(navigator.connection.type);
    }
}else{
    alert('Cannot find Window.Connection');
}

  });
})

当我将 app.js 和 controllers.js 复制粘贴到 testApp/www/js 目录时，整个事情就炸了.

The moment I copy paste my app.js and controllers.js to the testApp/www/js directory the whole thing blows up.

非常感谢任何调试帮助.

Any help in debugging is highly appreciated.

谢谢，

注意

我在 index.html 中有 cordova.js.

我也复制粘贴后重新安装了platforms和plugins.

I have re installed platforms and plugins after copy paste as well.

推荐答案

我使用 ngcordova 解决了类似的问题.它为您提供了一个围绕实现承诺的插件的角度包装.

I solved a similar issue by using ngcordova . It gives you an angular wrapper around the plugin that implements promises.

当您尝试调用 Cordova 插件时，通常它们还没有准备好，使用 promise 接口可以避免出现未定义的错误.

Often Cordova plugins aren't ready when you try to call them, using the promise interface you can avoid getting undefined errors.

我从网络插件这里的ngcordova页面上窃取了示例.

I stole the example from the ngcordova page on the network plugin here.

module.controller('MyCtrl', function($scope, $rootScope, $cordovaNetwork) {

 document.addEventListener("deviceready", function () {

    var type = $cordovaNetwork.getNetwork()

    var isOnline = $cordovaNetwork.isOnline()

    var isOffline = $cordovaNetwork.isOffline()


    // listen for Online event
    $rootScope.$on('networkOffline', function(event, networkState){
      var onlineState = networkState;
    })

    // listen for Offline event
    $rootScope.$on('networkOffline', function(event, networkState){
      var offlineState = networkState;
    })

  }, false);
});

这篇关于Ionic:使用 Cordova 检查 Internet 连接的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！