Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

IBeacon plugin not working using Ionic v4 beta #2631

Closed
elmergu opened this issue Aug 6, 2018 · 42 comments
Closed

IBeacon plugin not working using Ionic v4 beta #2631

elmergu opened this issue Aug 6, 2018 · 42 comments

Comments

@elmergu
Copy link

elmergu commented Aug 6, 2018

I'm submitting a ...
[x] bug report
[ ] feature request
[ ] support request => Please do not submit support requests here, use one of these channels: https://forum.ionicframework.com/ or https://ionicworldwide.herokuapp.com/

Current behavior:
the following error is displayed in xcode when running from the device

ERROR: [Cordova-Plugin-IBeacon] WARNING did not receive delegate ready callback from dom after 30 seconds

Expected behavior:
beacon ranging and monitoring should start

Steps to reproduce:

Using the start app
ionic start myApp tabs --type=angular

Installing the ibeacon plugin
ionic cordova plugin add cordova-plugin-ibeacon
$ npm install --save @ionic-native/ibeacon@beta

adding in the app.module.ts the plugin

import { IBeacon } from '@ionic-native/ibeacon/ngx';

@NgModule({
  declarations: [AppComponent],
  entryComponents: [],
  imports: [BrowserModule, IonicModule.forRoot(), AppRoutingModule],
  providers: [
    StatusBar,
    SplashScreen,
    IBeacon,
    { provide: RouteReuseStrategy, useClass: IonicRouteStrategy }
  ],
  bootstrap: [AppComponent]
})
export class AppModule {}

Related code:

home.page.ts

import { Component } from '@angular/core';
import { IBeacon, IBeaconPluginResult } from '@ionic-native/ibeacon/ngx';
import { Platform } from '@ionic/angular';

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

  private uuid = '11111111-1111-1111-1111-111111111111';
  beaconData = {};
  beaconUuid: String;

  constructor(private readonly ibeacon: IBeacon, private readonly platform: Platform) {
    this.enableDebugLogs();
  }

  public enableDebugLogs(): void {
    this.platform.ready().then(async () => {
      this.ibeacon.enableDebugLogs();
      this.ibeacon.enableDebugNotifications();
    });
  }

  public onStartClicked(): void {
    this.platform.ready().then(() => {
      this.startBleFun();
    });
  }

  public startBleFun(): void {

    // Request permission to use location on iOS
    this.ibeacon.requestAlwaysAuthorization();
    // create a new delegate and register it with the native layer
    const delegate = this.ibeacon.Delegate();

    this.ibeacon.setDelegate(delegate);
    this.beaconUuid = this.uuid;
    // Subscribe to some of the delegate's event handlers
    delegate.didRangeBeaconsInRegion().subscribe(
      (pluginResult: IBeaconPluginResult) => console.log('didRangeBeaconsInRegion: ', pluginResult),
      (error: any) => console.error(`Failure during ranging: `, error)
    );
    delegate.didStartMonitoringForRegion().subscribe(
      (pluginResult: IBeaconPluginResult) => console.log('didStartMonitoringForRegion: ', pluginResult),
      (error: any) => console.error(`Failure during starting of monitoring: `, error)
    );

    delegate.didEnterRegion().subscribe(
      (pluginResult: IBeaconPluginResult) => {
        console.log('didEnterRegion: ', pluginResult);
        this.beaconData = pluginResult;
      }
    );

    delegate.didExitRegion().subscribe(
      (pluginResult: IBeaconPluginResult) => {
        console.log('didExitRegion: ', pluginResult);
      }
    );

    console.log(`Creating BeaconRegion with UUID of: `, this.uuid);
    const beaconRegion = this.ibeacon.BeaconRegion('nullBeaconRegion', this.uuid, 1, 1);

    this.ibeacon.startMonitoringForRegion(beaconRegion).then(
      () => console.log('Native layer recieved the request to monitoring'),
      (error: any) => console.error('Native layer failed to begin monitoring: ', error)
    );

    this.ibeacon.startRangingBeaconsInRegion(beaconRegion)
      .then(() => {
        console.log(`Started ranging beacon region: `, beaconRegion);
      })
      .catch((error: any) => {
        console.error(`Failed to start ranging beacon region: `, beaconRegion);
      });
  }

}

home.page.html

<ion-header>
  <ion-toolbar>
    <ion-title>Home</ion-title>
  </ion-toolbar>
</ion-header>

<ion-content padding>
    <h3>Cordova Proximity Quickstart</h3>
  <ion-list>

    <ion-item>
      <ion-label fixed>UUID</ion-label>
      <ion-textarea type="text" [(ngModel)]="uuid"></ion-textarea>
    </ion-item>

  </ion-list>

  <div>
    <div>beacon DATA</div>
    <div>{{beaconUuid}}</div>
    {{beaconData | json}}
  </div>

  <ion-button shape="round" (click)="onStartClicked()" color="primary" fill="outline">Start</ion-button>

  
</ion-content>

Other information:

Ionic info:

Ionic:

   ionic (Ionic CLI)          : 4.0.3 (/Users/estuardo/.npm-packages/lib/node_modules/ionic)
   Ionic Framework            : @ionic/angular 4.0.0-beta.0
   @angular-devkit/core       : 0.7.0-rc.3
   @angular-devkit/schematics : 0.7.0-rc.3
   @angular/cli               : 6.0.8
   @ionic/ng-toolkit          : 1.0.0
   @ionic/schematics-angular  : 1.0.1

Cordova:

   cordova (Cordova CLI) : 8.0.0
   Cordova Platforms     : ios 4.5.5

System:

   NodeJS : v8.11.3 (/usr/local/bin/node)
   npm    : 5.8.0
   OS     : macOS High Sierra
   Xcode  : Xcode 9.4.1 Build version 9F2000

Environment:

   ANDROID_HOME : not set
@fengyanliang
Copy link

I have the same issue, have you fixed it now?

@halindrome
Copy link

halindrome commented Sep 18, 2018

I also have a similar issue. In my case, debugging shows that the android app is throwing an error when attempting to create the Delegate object:

let d = this.ibeacon.Delegate();

This throws an error in the ionic-native ngx module from the line that tries to create a new Delegate calling the cordova plugin (line 29 of ngx/index.js):

var delegate = new cordova.plugins.locationManager.Delegate();

The error I see in the Chrome debugger console is:

ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'locationManager' of undefined

Single stepping through it, it seems like the cordova.plugins interface is set up, so I don't really know what it is complaining about. Thoughts?

@hhetland
Copy link

I also have problems with the iBeacon plugin, using 5.0.0.0-beta.20 but same error on previous versions.
On IOS this shows up in the developer console in Safari, any clues there?:

Error: Uncaught (in promise): TypeError: undefined is not an object (evaluating 'new ionic_native_core__WEBPACK_IMPORTED_MODULE_1_["cordova"].plugins.locationManager')

@danielsogl
Copy link
Owner

cc @mlynch can you take a look for me?

@hhetland
Copy link

No changes in beta 21, same error as described above

@raujonas
Copy link

raujonas commented Nov 12, 2018

@halindrome Do you know what I can do in that case? I have the same issue with the location manager, I am currenty using the beta 21, but receive the exact same error as you.

@matteocusinato
Copy link

I have the same issue, please solve it!!

@matteobortolazzo
Copy link

Please fix it.

@kurtommy
Copy link

Hi @danielsogl @mlynch here you have an example of not working plugin
https://github.com/kurtommy/ionic-ibeacon-broken

i've created new app from scratch with the CLI (ionic version 4)
then followed steps found here
https://beta.ionicframework.com/docs/native/ibeacon

but i have in console
ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'locationManager' of undefined

@gischy
Copy link

gischy commented Dec 20, 2018

same issue

@kurtommy
Copy link

kurtommy commented Dec 20, 2018

@ihadeed @danielsogl Hi guys some help on this? we are building a nice app to track children that are taking the bus to send notifications to parents if they have took the bus or not. we are using ionic and beacon but this plugin is not working...

there is the same issue opened here without response yet
petermetz/cordova-plugin-ibeacon#403

@MASP3000
Copy link

MASP3000 commented Jan 25, 2019

I have the same problem but with the new realase of V4. Any solution or idea to solve this problem?

I would like to add some comments. Maybe it could be help someone to find a solution.

When I used V4 Beta I added the pluggin using npm install @ionic-native/ibeacon**@beta**.

I updated Ionic and I started to use the version 4 and I cleaned my project and I installed all plugins again following the installation commads described in the web page of Ionic Native, without using @beta anymore. All plugings workes fine, but IBeacon import in app.modules.ts was not recognized if one uses "import { IBeacon } from '@ionic-native/ibeacon**/ngx**'". Installing the plugin using @beta achives the import recognition, but the plugin still not working.

I think, that if is not possible to solve this problem I will have to back to work with our old code for version 3 of Ionic.

Thank you for your help.

@bitforcesrl
Copy link

Fortunately Ionic 4 stable was released yesterday and maybe we'll get more attention to this issue, i've opened other issues in the cordova plugin repo i've also asked if this project is still mantained but seems not

petermetz/cordova-plugin-ibeacon#407

@EdByrnee
Copy link

EdByrnee commented Feb 1, 2019

Any solution yet guys?

@bitforcesrl
Copy link

nothing here.. i've asked same question on the ionic slack to Mike an ionic mantainer he asked me for a live broken example but i don't have time now to perpare it, someone has some basic example to share with him?

https://ionic-worldwide.slack.com/archives/C03AJV5A5/p1548779396066400

@matteocusinato
Copy link

nothing here.. i've asked same question on the ionic slack to Mike an ionic mantainer he asked me for a live broken example but i don't have time now to perpare it, someone has some basic example to share with him?

https://ionic-worldwide.slack.com/archives/C03AJV5A5/p1548779396066400

Ok, done.

@EdByrnee
Copy link

EdByrnee commented Feb 4, 2019

Thank you

nothing here.. i've asked same question on the ionic slack to Mike an ionic mantainer he asked me for a live broken example but i don't have time now to perpare it, someone has some basic example to share with him?
https://ionic-worldwide.slack.com/archives/C03AJV5A5/p1548779396066400

Ok, done.

Thank you, we all appreciate it. Hopefully we hear back soon.

For anyone looking for an interim solution, I've managed to get the plugin working in Ionic v3 in the foreground and background but when the app is closed it is not relaunching the application. If anyone has any solution it would be greatly appreciated. Thanks

@matteocusinato
Copy link

@arneldomingo can you tell me a little more? Thanks

@bitforcesrl
Copy link

@arneldomingo can you create a pull request with that? or a fork with the fix in your github ? thanks

@Linkmetal
Copy link

@arneldomingo It worked for me! Literally saved my life.

@EdByrnee
Copy link

EdByrnee commented Feb 7, 2019

Thank you! Got this working and monitoring iBeacons in the background and foreground. I'll make a PR

(Still no luck with monitoring when the app is closed)

@Linkmetal
Copy link

Idk if it's intended because is my first time working with beacons,when I detect a beacon with a certain uuid, I can't detect it anymore for some minutes, even restarting the app. Maybe is due to the files that we modified to fix the bug, or is there any kind of timer to detect a beacon again?

@MASP3000
Copy link

Hey @arneldomingo.
Do you have a copy of the file /ibeacon/ngx/index.js?

It could be good to compare with my file index.js

Thanks!

@tommasorossi
Copy link

This WE i found time to try all my beacons, debugging the plugin it looks like that cordova variable is shadowed
In ./ibeacon/ngx/index.js,
i've replaced
cordova.plugins.locationManager.Delegate();
with
window.cordova.plugins.locationManager.Delegate();

but there is no point to use this lib which is not mantained anymore.
Instead there is this great plugin which works in just one line of code with Eddystone (which is more capable than iBeacon from Apple)
It works perfectly

https://www.npmjs.com/package/cordova-plugin-eddystone

@elTigre9
Copy link

@tommasorossi
That did the trick for me.

I created a plugin for ibeacon in Swift that's largely unfinished. It connects and ranges, but the delegate callbacks don't work, so you'd have to go into the Swift code and customize it there. I'm going to keep working on it, just in case people don't want to toss their iBeacons in the trash.

@giladrom
Copy link

@tommasorossi iOS will not wake up in the background for Eddystone beacons - which are also not supported anymore by Google.

@elTigre9
Copy link

Hi everyone. I have the new beacon plugin setup on my account: https://github.com/elTigre9/cordova-plugin-beaconing. I hope it comes in handy!

NOTES:

  1. Currently, it's only for iOS.
  2. You can only run 1 beacon at a time
  3. You can only range and monitor (enter and exit beacon region)
  4. It's written in Swift 4
  5. Still a work in progress, but I feel like it's got potential

@IT-Dan
Copy link

IT-Dan commented Feb 21, 2019

Here's a copy of those files that need to be modified https://github.com/IT-Dan/Ionic4ibeacon/.

@EdByrnee
Copy link

I cannot find any working solution for monitoring iBeacons when the app is closed. This repo is the closest I can get to it, it works in the foreground/background but not when the app is closed. Does anyone know of a working solution or will I have to learn swift?

@RangerRick
Copy link

I can confirm that the patch to use cordova.plugins rather than window.cordova.plugins works for me as well. I checked out https://github.com/IT-Dan/Ionic4ibeacon/ and changed my import from @ionic-native/ibeacon/ngx to 3rdparty/Ionic4ibeacon/ngx and I'm getting ibeacon events.

@cagb80
Copy link

cagb80 commented May 27, 2019

Here's a copy of those files that need to be modified https://github.com/IT-Dan/Ionic4ibeacon/.

This worked for me... @IT-Dan TY

@kodeine
Copy link

kodeine commented Mar 23, 2020

This WE i found time to try all my beacons, debugging the plugin it looks like that cordova variable is shadowed
In ./ibeacon/ngx/index.js,
i've replaced
cordova.plugins.locationManager.Delegate();
with
window.cordova.plugins.locationManager.Delegate();

but there is no point to use this lib which is not mantained anymore.
Instead there is this great plugin which works in just one line of code with Eddystone (which is more capable than iBeacon from Apple)
It works perfectly

https://www.npmjs.com/package/cordova-plugin-eddystone

can you share how you used that plugin in ionic?

@atmosuwiryo
Copy link

It is said that this is ionic-native bug here, dated 28-03-2019.
ionic-team/capacitor#1367 (comment)
Still no bug fix until now?

@kodeine
Copy link

kodeine commented Mar 23, 2020

anyone was able to make advertising work? to me this.ibeacon.isAdvertising() coming as false even though i started advertising.

@RangerRick
Copy link

FYI, if you're trying to do beacon stuff under Capacitor, I've written a Capacitor plugin for it: https://github.com/rangerrick/capacitor-ibeacon

Haven't had a chance to implement the Android side yet, so it's iOS-only for now.

@mohit810
Copy link

mohit810 commented May 4, 2020

I cannot find any working solution for monitoring iBeacons when the app is closed. This repo is the closest I can get to it, it works in the foreground/background but not when the app is closed. Does anyone know of a working solution or will I have to learn swift?

@EdByrnee can u provide ur working code , please.?

 `import {ChangeDetectorRef, Component} from '@angular/core';
  import { Platform} from 'ionic-angular';
  import {IBeacon} from "@ionic-native/ibeacon";
  import {isBoolean} from "ionic-angular/util/util";
 @Component({
  selector: 'page-home',
  templateUrl: 'home.html'
 })
 export class HomePage {
 homePage: string =null;
 outputdata: any;
 outputerror: any;
 inputdata: any;
 inputerror: any;
 beaconData: any;
 advertinputdata: any;
 advertavailinputerror: any;
 buke: any;
 auther: any;


  constructor(public change: ChangeDetectorRef,
          public platform: Platform,
          private ibeacon: IBeacon,) {
  this.homePage =  "1000";
 }
 watch() {
  this.ibeacon.getAuthorizationStatus().then(
   data => this.auther = data.authorizationStatus,
   error => console.error(error)
   )
   this.platform.ready().then(()=>{
   this.ibeacon.isBluetoothEnabled().then(
   ()=> this.buke = isBoolean(this.ibeacon.isBluetoothEnabled()),
   error => console.error(error)
   )
   this.ibeacon.startAdvertising(this.ibeacon.BeaconRegion('deskBeacon', '7813eab4-9ee5-447b-b3ee-6179c9b9877a', 10, 10, true), -59).then(
    () => this.inputdata = "yay!" + console.log("yay! task done"),
    error => console.error(error)
    )
     this.ibeacon.isAdvertising().then(
     () => this.advertinputdata = isBoolean(this.ibeacon.isAdvertising())  ,
     error => console.error(error)
     )
    })
   }
   monitor(){
   this.platform.ready().then(()=>{
   // Request permission to use location on iOS
   this.ibeacon.requestAlwaysAuthorization();
  // create a new delegate and register it with the native layer
  let delegate = this.ibeacon.Delegate();

  // Subscribe to some of the delegate's event handlers
  delegate.didRangeBeaconsInRegion()
  .subscribe(
    data => this.outputdata = data,
    error => console.error()
  );
  delegate.didStartMonitoringForRegion()
  .subscribe(
    data => console.log('didStartMonitoringForRegion: ', data),
    error => console.error()
  );
   delegate.didEnterRegion()
  .subscribe(
    data => {
      console.log('didEnterRegion: ', data);
    }
  );
  let beaconRegion = this.ibeacon.BeaconRegion('deskBeacon','7813eab4-9ee5-447b-b3ee-6179c9b9877a');

  this.ibeacon.startMonitoringForRegion(beaconRegion)
  .then(
    () => console.log('Native layer received the request to monitoring'),
    error => console.error('Native layer failed to begin monitoring: ', error)
    );
   })
  }
 }`

the output that i am getting is :
.isAdvertising() = false
.isBluetoothEnabled() =false
.getAuthorizationStatus() = authorised
.startAdvertising()= i am getting yay but its not advertising

plus when i was trying evothing's eddystone after adding the plugin the advertising code is not working as the downloaded plugin's code itself doesn't has the startadvertising function but online where i see the source code it is present

@mohit810
Copy link

mohit810 commented May 4, 2020

This WE i found time to try all my beacons, debugging the plugin it looks like that cordova variable is shadowed
In ./ibeacon/ngx/index.js,
i've replaced
cordova.plugins.locationManager.Delegate();
with
window.cordova.plugins.locationManager.Delegate();

but there is no point to use this lib which is not mantained anymore.
Instead there is this great plugin which works in just one line of code with Eddystone (which is more capable than iBeacon from Apple)
It works perfectly

https://www.npmjs.com/package/cordova-plugin-eddystone

@tommasorossi i am not able to use that lib. as when i try to add it as a plugin only scanning code gets add as plugin not the advertising code.

@MiguelAngelBrito
Copy link

This WE i found time to try all my beacons, debugging the plugin it looks like that cordova variable is shadowed
In ./ibeacon/ngx/index.js,
i've replaced
cordova.plugins.locationManager.Delegate();
with
window.cordova.plugins.locationManager.Delegate();
but there is no point to use this lib which is not mantained anymore.
Instead there is this great plugin which works in just one line of code with Eddystone (which is more capable than iBeacon from Apple)
It works perfectly
https://www.npmjs.com/package/cordova-plugin-eddystone

@tommasorossi i am not able to use that lib. as when i try to add it as a plugin only scanning code gets add as plugin not the advertising code.

I also have a similar issue. In my case, debugging shows that the android app is throwing an error when attempting to create the Delegate object:

let d = this.ibeacon.Delegate();

This throws an error in the ionic-native ngx module from the line that tries to create a new Delegate calling the cordova plugin (line 29 of ngx/index.js):

var delegate = new cordova.plugins.locationManager.Delegate();

The error I see in the Chrome debugger console is:

ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'locationManager' of undefined

Single stepping through it, it seems like the cordova.plugins interface is set up, so I don't really know what it is complaining about. Thoughts?

I had the same issue, the origin of problem is the version android try with it
ionic cordova platform add android@^8.1.0-nightly.2019.9.10.42c0cba7

@MiguelAngelBrito
Copy link

I also have a similar issue. In my case, debugging shows that the android app is throwing an error when attempting to create the Delegate object:

let d = this.ibeacon.Delegate();

This throws an error in the ionic-native ngx module from the line that tries to create a new Delegate calling the cordova plugin (line 29 of ngx/index.js):

var delegate = new cordova.plugins.locationManager.Delegate();

The error I see in the Chrome debugger console is:

ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'locationManager' of undefined

Single stepping through it, it seems like the cordova.plugins interface is set up, so I don't really know what it is complaining about. Thoughts?

I had the same issue, the origin of problem is the version android try with it
ionic cordova platform add android@^8.1.0-nightly.2019.9.10.42c0cba7

@YouQam
Copy link

YouQam commented Aug 8, 2020

Here's a copy of those files that need to be modified https://github.com/IT-Dan/Ionic4ibeacon/.

Thanks!
It used to work with me in ionic4 but I realized that in ionic5 the file ivy_ngcc/ngx/index.js should be modified as well.

You can find the files to be modified in ionic5 in https://github.com/YouQam/ionic5ibeacon

The solution has been tested using both iOS and Android devices.

@Stefanic
Copy link
Contributor

I made a pull request for the Ionic Native wrapper of this library last week and it has already been released with version 5.28.0:
#3505

Hope it helps you guys!

@github-actions
Copy link

github-actions bot commented Sep 9, 2021

There has been no recent activity and this issue has been marked inactive.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests