【问题标题】:Cordova Geofencing plugin not workingCordova 地理围栏插件不起作用
【发布时间】:2015-09-03 12:52:18
【问题描述】:

我需要制作一个应用程序,当用户进入特定的地理围栏区域时向用户发出警报。我试过科尔多瓦地理围栏插件。但是当我进入该区域时它不起作用。我不知道是什么问题。这是我的代码。

app.js

// Ionic Starter App

// angular.module is a global place for creating, registering and retrieving Angular modules
// 'starter' is the name of this angular module example (also set in a <body> attribute in index.html)
// the 2nd parameter is an array of 'requires'
angular.module('starter', ['ionic','ngCordova'])

.run(function($ionicPlatform) {
    $ionicPlatform.ready(function () {
           // $log.log('Ionic ready');
            // 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) {
                StatusBar.styleDefault();
            }
            if ($window.geofence) {
                $window.geofence.initialize();

                $window.geofence.onTransitionReceived = function (geofences) {
                  //  $log.log(geofences);
                    if (geofences) {
                        $rootScope.$apply(function () {
                            geofences.forEach(function (geo) {
                                geo.notification = geo.notification || {
                                    title: 'Geofence transition',
                                    text: 'Without notification'
                                };
                               // toaster.pop('info', geo.notification.title, geo.notification.text);
                            });
                        });
                    }
                };

                $window.geofence.onNotificationClicked = function (notificationData) {
                    $log.log(notificationData);
                    if (notificationData) {
                        $rootScope.$apply(function () {
                          //  toaster.pop('warning', 'Notification clicked', notificationData.notification.text);
                        });
                    }
                };
            }
           
        });

})


//Entering Zandig

window.geofence.addOrUpdate({
    id:             "e941166e-2409-4c97-8c80-14ba9e9d71c9",
    latitude:       12.958535143383823,
    longitude:      77.6381016522646,
    radius:         5,
    transitionType: 1
}).then(function () {
	document.getElementById("notification").innerHTML= "Reached Zandig";
    console.log('Geofence successfully added');
}, function (reason) {
    console.log('Adding geofence failed', reason);
});

//Leaving Trivandrum

window.geofence.addOrUpdate({
    id:             "1e473337-4747-4ac3-b921-ccaf572f38ce",
    latitude:       8.487695348115592,
    longitude:      76.95057034492493,
    radius:         3,
    transitionType: 2
   
}).then(function () {
	document.getElementById("notification").innerHTML= "Left Trivandrum";
    console.log('Geofence successfully added');
}, function (reason) {
    console.log('Adding geofence failed', reason);
});

//Entering 61

window.geofence.addOrUpdate({
    id:             "8f8119ce-b577-4f22-9880-57333fcff5de",
    latitude:       12.9593547,
    longitude:      77.63604520000001,
    radius:         5,
    transitionType: 1
    
}).then(function () {
	document.getElementById("notification").innerHTML= "Entered 61";
    console.log('Geofence successfully added');
}, function (reason) {
    console.log('Adding geofence failed', reason);
});

//Entering Santhi Sagar

window.geofence.addOrUpdate({
    id:             "d2c08c58-4f31-44e9-8a5c-8baaae3ebee3",
    latitude:       12.960690294723518,
    longitude:      77.63856634497643,
    radius:         15,
    transitionType: 1
}).then(function () {
	document.getElementById("notification").innerHTML= "Entered Santhi Sagar";
    console.log('Geofence successfully added');
}, function (reason) {
    console.log('Adding geofence failed', reason);
});

//Leaving Santhi Sagar

window.geofence.addOrUpdate({
    id:             "6923cf7d-470e-4921-9b54-4516c504cba5",
    latitude:       12.960690294723518,
    longitude:      77.63856634497643,
    radius:         15,
    transitionType: 2
}).then(function () {
	document.getElementById("notification").innerHTML= "Left Santhi Sagar";
    console.log('Geofence successfully added');
}, function (reason) {
    console.log('Adding geofence failed', reason);
});

//Getting watched from device

window.geofence.getWatched().then(function (geofencesJson) {
    var geofences = JSON.parse(geofencesJson);
});

//Listening for Geofencing transitions

window.geofence.onTransitionReceived = function (geofences) {
    geofences.forEach(function (geo) {
		alert('Geofence transition detected');
        console.log('Geofence transition detected', geo);
    });
};

//When click on notification

window.geofence.onNotificationClicked = function (notificationData) {
	Alert('Geofencing is Working');
    console.log('App opened from Geo Notification!', notificationData);
};

索引.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <title></title>

    <link href="lib/ionic/css/ionic.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">

    <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
    <link href="css/ionic.app.css" rel="stylesheet">
    -->

    <!-- ionic/angularjs js -->
    <script src="lib/ionic/js/ionic.bundle.js"></script>

    <!-- cordova script (this will be a 404 during development) -->
	<script src="js/ng-cordova.min.js"></script>
    <script src="cordova.js"></script>

    <!-- your app's js -->
    <script src="js/app.js"></script>
  </head>
  <body ng-app="starter">

    <ion-pane>
      <ion-header-bar class="bar-stable">
        <h1 class="title">Geofencing</h1>
      </ion-header-bar>
      <ion-content>
	  <p id="notification"></p>
      </ion-content>
    </ion-pane>
  </body>
</html>

(在插件的 Github 页面中,有一个选项“地理围栏的唯一 ID”。我从 UUID 生成器在线页面添加了唯一 ID。)

但没有显示警报。有人可以帮忙吗?

当我使用 ionic serve 运行时,在控制台中发现了以下错误。 '未捕获的类型错误:无法读取未定义的属性'addOrUpdate'。

这是我的设备控制台错误。

0 466310 error Uncaught TypeError: Cannot read property'addOrUpdate' of undefined, http://192.168.43.148.8100/js/app.js, Line 28

1 466870 错误未找到 Content-Security-Policy 元标记。使用cordova-plugin-whitelist插件时请加一个。

2 466930 error Uncaught TypeError: object is not a function, http://192.168.43.148:8100/plugins/cordova/plugin-geofence/www.geofence.js, Line 119

谁能帮帮我?

【问题讨论】:

  • 你能告诉我..如何得到这个“id:e941166e-2409-4c97-8c80-14ba9e9d71c9”属性值

标签: angularjs cordova ionic-framework ionic geofencing


【解决方案1】:

这是来自同一插件作者的 ionic 示例项目:https://github.com/cowbell/ionic-geofence,在其中您可以看到如何在 ionic 中使用它的完整指南。您的代码也应该可以工作,但您犯的错误很少。如果您想在应用程序初始化时运行一些与插件相关的代码,请将它们放入.run() 部分,您正在使用插件调用。另外不需要像$ionicPlatform.ready那样使用document.addEventListener('deviceready'),在里面初始化插件。你的代码会是这样的

angular.module('starter', ['ionic','ngCordova'])
  .run(function($ionicPlatform) {
      $ionicPlatform.ready(function() {
    //Use your plugin related calls in this area
   }) 
});

您收到了undefined 的错误,因为您甚至在应用程序可以使用它们的对象之前就进行了插件调用。同样,您希望在初始化时运行的任何与插件相关的调用,请在$ionicPlatform.ready(function() {}) 中使用它们。

【讨论】:

  • 我根据您的回复编辑了代码。但问题仍然存在。我用编辑后的 ​​app.js 更新了我的问题。我的应用程序中没有显示任何内容,也没有通知。我构建了 android 应用程序并将其放入我的手机中。什么都没有发生。即使在重新启动我的应用程序后我也尝试过。没有反应。请帮帮我。
【解决方案2】:

所以我看到您说您使用离子服务器对其进行了测试。你不能通过浏览器测试插件,你必须在设备上实际安装它才能测试cordova插件。您还可以使用 intel xdk 通过仿真测试大多数插件。 https://software.intel.com/en-us/intel-xdk 只需导入您的项目并模拟它,然后通过右侧的地图移动到您的地理围栏位置。或者您可以点击测试选项卡并将其推送到手机并使用您的 iPhone 或 Android 设备上的英特尔应用预览应用进行测试。最后但并非最不重要的一点是,您可以使用调试选项卡通过 USB 电缆将其直接推送到设备,这将允许您在测试设备上的插件时拥有一个调试控制台。

【讨论】:

  • @jess_patton :我尝试在安卓手机中安装该应用程序。但是,即使我非常靠近地理围栏区域,也没有任何通知,也没有任何消息。我只在浏览器上尝试检查控制台错误。不知道是什么问题?
  • 如果您想从设备检查控制台,请运行以下命令:ionic run android -l -c 这将在您的命令行窗口中显示所有设备日志。并确保设备和计算机连接到同一网络。
  • 是的,我同意 muasser。您需要在设备上对其进行调试才能看到正确的调试输出。一旦你这样做发布错误,我会尝试找到一个修复。
  • @JessPatton,@mudasser:你们能帮帮我吗?
  • 谁能告诉我..如何获得这个“id:e941166e-2409-4c97-8c80-14ba9e9d71c9”属性值
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2017-03-15
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多