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