capacitor-community / background-geolocation

A Capacitor plugin that sends you geolocation updates, even while the app is in the background.
MIT License
177 stars 54 forks source link

TypeError: BackgroundGeolocation.addWatcher is not a function #68

Closed Gladiatornoshield closed 2 years ago

Gladiatornoshield commented 2 years ago

Describe the bug Good Day I am having trouble implementing this solution on my Ionic 6 capacitor 3 project. After installing the plugin i follow all the steps to configure the project files.

To Reproduce I import the module inside app.component.ts Then I paste the usage code inside initialize app. Also tried running it inside a function starttracking.

improt used

import {registerPlugin} from "@capacitor/core"; const {BackgroundGeolocation} = registerPlugin("BackgroundGeolocation");

Expected behavior I want to capture latitude and longitude details of the device when it starts up or when they change. I am using an android simulator to test.

Screenshots image image

Desktop (please complete the following information):

Smartphone (please complete the following information):

Additional context My problem is that I am not sure if i am applying the code at the correct place. I have also tried using typescript import but give me an error saying registerPlugin cannot be found. I would really appreciate if you can just point me to the correct direction.

diachedelic commented 2 years ago

Remove the braces around BackgroundGeolocation, like this:

const BackgroundGeolocation = registerPlugin("BackgroundGeolocation");
Gladiatornoshield commented 2 years ago

Good Day

I have removed them but i get error on the

addWatcher openSettings removeWatcher

Property 'addWatcher' does not exist on type 'unknown'

But with the braces in place the error disappears but brings [TypeError: BackgroundGeolocation.addWatcher is not a function] when i run the app.

image

diachedelic commented 2 years ago

Ah, you are using Typescript. Refer to the README for how to import the TypeScript types.

Gladiatornoshield commented 2 years ago

Good Day. Thank you so much for your responses. I really appreciate it. I have managed to import it as follows.

import {registerPlugin} from "@capacitor/core"; import {BackgroundGeolocationPlugin} from "@capacitor-community/background-geolocation"; const BackgroundGeolocation = registerPlugin("BackgroundGeolocation");

Now i get required logs but I get result undefined when running on simulator.

image

Instead of getting the location object i see the following on the console

image

When starting up for the first time it askes for permissions. Not sure what could be causing this behaviour, But really need this to work as its the final piece of the App i have been building.

diachedelic commented 2 years ago

It is fine to get a result of undefined from calling removeWatcher. The location objects are delivered to the callback of addWatcher. You should only remove the watcher when you no longer want location objects. It looks like you are removing it right after adding it.

It is normal behaviour for the plugin to request permissions when you first add a watcher. You can control this with the requestPermissions option.

Gladiatornoshield commented 2 years ago

I'm still not getting that object. I have create a fresh ionic install with the following details.

image

Then I configured the Android Manifest and strings XML files. Loads as expected. Asks for permissions but gives me the same results. I am attached the exact code.

import { Component } from '@angular/core'; import {registerPlugin} from "@capacitor/core"; import {BackgroundGeolocationPlugin} from "@capacitor-community/background-geolocation"; const BackgroundGeolocation = registerPlugin("BackgroundGeolocation");

@Component({ selector: 'app-home', templateUrl: 'home.page.html', styleUrls: ['home.page.scss'], }) export class HomePage {

constructor() {}

ngOnInit() { // To start listening for changes in the device's location, add a new watcher. // You do this by calling 'addWatcher' with an options object and a callback. A // Promise is returned, which resolves to the callback ID used to remove the // watcher in the future. The callback will be called every time a new location // is available. Watchers can not be paused, only removed. Multiple watchers may // exist simultaneously. BackgroundGeolocation.addWatcher( { // If the "backgroundMessage" option is defined, the watcher will // provide location updates whether the app is in the background or the // foreground. If it is not defined, location updates are only // guaranteed in the foreground. This is true on both platforms.

  // On Android, a notification must be shown to continue receiving
  // location updates in the background. This option specifies the text of
  // that notification.
  backgroundMessage: "Cancel to prevent battery drain.",

  // The title of the notification mentioned above. Defaults to "Using
  // your location".
  backgroundTitle: "Tracking You.",

  // Whether permissions should be requested from the user automatically,
  // if they are not already granted. Defaults to "true".
  requestPermissions: true,

  // If "true", stale locations may be delivered while the device
  // obtains a GPS fix. You are responsible for checking the "time"
  // property. If "false", locations are guaranteed to be up to date.
  // Defaults to "false".
  stale: false,

  // The minimum number of metres between subsequent locations. Defaults
  // to 0.
  distanceFilter: 50

}, function callback(location, error) { if (error) { if (error.code === "NOT_AUTHORIZED") { if (window.confirm( "This app needs your location, " + "but does not have permission.\n\n" + "Open settings now?" )) { // It can be useful to direct the user to their device's // settings when location permissions have been denied. The // plugin provides the 'openSettings' method to do exactly // this. BackgroundGeolocation.openSettings(); } } return console.error(error); }

  return console.log(location);

} ).then(function after_the_watcher_has_been_added(watcher_id) { // When a watcher is no longer needed, it should be removed by calling // 'removeWatcher' with an object containing its ID. BackgroundGeolocation.removeWatcher({ id: watcher_id }); });

}

}

Gladiatornoshield commented 2 years ago

image

Thats what i see on the console. Not sure if maybe its a simulator issue or I'm just missing something. It does not seems to be running the call back as it does not give me any errors or location object

diachedelic commented 2 years ago

Yes, you are removing the watcher immediately after adding it. It does not get a chance to produce a location object.

Gladiatornoshield commented 2 years ago

Awesome. I removed the watcher. Now I get the location object. Thank you sooo much for your patience and help really appreciate it. So if the watcher is never removed would that affect the app in anyway. I want to keep it live until the app is terminated.

diachedelic commented 2 years ago

That should be fine, so long as your users can work out how to terminate your app.

Gladiatornoshield commented 2 years ago

Good Day @diachedelic Hope you doing well

I want to save the location object to my DB but the resulting object always appears to run last on my code sequence. Where can I manipulate it so I can run updateLocation function after the resulting object has been created. I'm on ionic 6 and capacitor 3.