Cordova Geofencing插件不起作用

Question

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

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); };

Index.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页面中，有一个选项“ geofence的唯一ID”。我从UUID生成器在线页面添加了唯一ID。）

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

当我使用离子服务运行时，在控制台中发现以下错误。 '未捕获的TypeError：无法读取未定义的属性'addOrUpdate'。

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

0 466310错误未捕获的TypeError：无法读取未定义的属性'addOrUpdate'，htttp：//192.168.43.148.8100/js/app.js，第28行

1 466870错误找不到内容安全策略元标记。 使用cordova-plugin-whitelist插件时，请添加一个。

2 466930错误未捕获的TypeError：对象不是函数， http://192.168.43.148 :8100/plugins/cordova/plugin-geofence/www.geofence.js，第119行

谁能帮我？

Answer 1

这是来自同一个插件的作者的ionic样本项目： https : //github.com/cowbell/ionic-geofence ，在其中您可以看到有关如何在ionic中使用它的完整指南。 您的代码也应该可以工作，但是您犯了一些错误。如果您想在应用程序初始化时运行一些与插件相关的代码，请将它们放入.run()部分，那么您将使用插件调用。 另外，由于您有$ionicPlatform.ready ，因此无需使用document.addEventListener('deviceready') ， $ionicPlatform.ready在其中初始化插件。 您的代码将如下所示

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

您会收到undefined错误，因为您是在插件调用尚未被应用程序使用之前就进行了插件调用。同样，要在初始化时运行的任何与插件相关的调用，请在$ionicPlatform.ready(function() {})使用它们$ionicPlatform.ready(function() {}) 。

Answer 2

所以我看到您说您使用离子服务器对其进行了测试。 您无法通过浏览器测试插件，您必须将其实际安装在设备上才能测试cordova插件。 您也可以使用intel xdk通过仿真测试大多数插件。 https://software.intel.com/zh-cn/intel-xdk只需导入您的项目并进行仿真，然后通过右侧的地图移至您的地理位置。 或者，您可以点击“测试”标签，然后将其推送到手机上，然后使用iphone或android设备上的“英特尔应用预览”应用进行测试。 最后但并非最不重要的一点是，您可以使用debug选项卡使用usb电缆将其直接推入设备，这将使您在调试设备上的插件时具有调试控制台。

Cordova Geofencing插件不起作用

问题描述

2 个解决方案

解决方案1
2 2015-09-18 21:01:12

解决方案2
0 2015-09-03 13:10:48

Cordova Geofencing插件不起作用

问题描述

2 个解决方案

解决方案1 2 2015-09-18 21:01:12

解决方案2 0 2015-09-03 13:10:48

解决方案1
2 2015-09-18 21:01:12

解决方案2
0 2015-09-03 13:10:48