Question

我正在尝试创建一个示例离子cordova iOS应用程序，该应用程序扫描附近的信标并将其（以及相关数据）打印到UI。值应随距离而变化。

我一直在关注以下示例（但使用事件的发布/订阅）：

https://ionicframework.com/docs/native/ibeacon/

我的问题是，在订阅didStartMonitoringForRegion事件之后，生成的BeaconList返回“未定义不是对象”。我似乎看不到附近的任何信标。我已经确认使用'Core Beacons'确实存在它们。其中二十个。

我正在下面设置手机的UUID-我是从this.device.uuid中获取它的：

BeaconRegion（'deskBeacon'，'A2E19874-3A63-4574-84B8-4720D0934099'）;

我是否应该明确命名要扫描的附近信标UUID（似乎不正确）？

不确定我为什么不接附近的信标。建议表示赞赏。

XCode 10.1 离子v3 科尔多瓦6.1.0

HOME.TS

    import { Component } from '@angular/core';
    import { NavController, Platform, Events } from 'ionic-angular';
    import { NgZone } from '@angular/core';

    // plugins

    import { BeaconProvider } from '../../providers/beacon-provider'
    import { BeaconModel } from '../../models/beacon-model';

    @Component({
      selector: 'page-home',
      templateUrl: 'home.html'
    })
    export class HomePage {

      beacons: BeaconModel[] = [];
      zone: any;


      constructor(public navCtrl: NavController, public platform: Platform,
        public beaconProvider: BeaconProvider, public events: Events) 
        {
            // required for UI update
          this.zone = new NgZone({ enableLongStackTrace: false });

        }

        ionViewDidLoad() {
          this.platform.ready().then(() => {
            this.beaconProvider.initialise()
            .then((isInitialised) => {
              if (isInitialised) {
                this.startScanningForBeaconEvents();
              }
            }).catch(err => {
              console.log(err);
              console.log(err.errors);
            });
          });
        }

        startScanningForBeaconEvents() {
          this.events.subscribe('didStartMonitoringForRegion', (data) => {
            // update the UI with the beacon list  
            this.zone.run(() => {
              this.beacons = [];
              let beaconList = data.beacons;

              beaconList.forEach((beacon) => {
                let beaconObject = new BeaconModel(beacon);
                this.beacons.push(beaconObject);
                console.log("nearby beacon " + beaconObject.uuid + " has been added");
              });
            });
        });

      }
    }

BEACONPROVIDER.TS

import { Injectable } from '@angular/core';
import { Platform, Events } from 'ionic-angular';
import { IBeacon } from '@ionic-native/ibeacon'
import { Device } from '@ionic-native/device'; 

@Injectable()
export class BeaconProvider {

  delegate: any;
  beaconRegion: any;
  uuid: any;
  isAdvertisingAvailable: boolean = null;

  constructor(private platform: Platform, private device: Device, 
    private ibeacon: IBeacon, public events: Events) {
      this.ibeacon = ibeacon;
      this.device = device;
      this.events = events;
      this.platform = platform;
      this.enableDebugLogs();
  }

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

  initialise(): any {

    this.uuid = this.device.uuid;

    let promise = new Promise((resolve, reject) => {
      // we need to be running on a device 
      if (this.platform.is('cordova')) {
        // Request permission to use location on iOS
        this.ibeacon.requestAlwaysAuthorization();
        // create a new delegate and register it with the native layer
        this.delegate = this.ibeacon.Delegate();
        // Subscribe to some of the delegate's event handlers
        this.delegate.didRangeBeaconsInRegion()
          .subscribe(
            data => {
              this.events.publish('didRangeBeaconsInRegion', data);
            },
              error => console.error()
            );
        this.delegate.didStartMonitoringForRegion()
        .subscribe(
          data => {
            this.events.publish('deskBeacon', data);
          },
          error => console.error()
          );
        this.delegate.didEnterRegion()
        .subscribe(
          data => {
            this.events.publish('didEnterRegion', data);
          },
          error => console.error()
          );
        this.delegate.didExitRegion().subscribe(
          data => {
            this.events.publish('didExitRegion', data);
          },
          error => console.error()
          );
        // setup a beacon region
        this.beaconRegion = this.ibeacon.BeaconRegion('deskBeacon', 'A2E19874-3A63-4574-84B8-4720D0934099');

        this.ibeacon.startMonitoringForRegion(this.beaconRegion)
          .then(() => {
            resolve(true);
          }).catch(error => {
            resolve(false);
          });
      } else {
        resolve(false);
      }
    });

    return promise;
  }

}

APP.MODULE.TS

import { BeaconProvider } from '../providers/beacon-provider'
import { BrowserModule } from '@angular/platform-browser';
import { IBeacon } from '@ionic-native/ibeacon'
import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { SplashScreen } from '@ionic-native/splash-screen';
import { StatusBar } from '@ionic-native/status-bar';
import { Device } from '@ionic-native/device';
import { MyApp } from './app.component';
import { HomePage } from '../pages/home/home';

@NgModule({
  declarations: [
    MyApp,
    HomePage
  ],
  imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp)
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    HomePage
  ],
  providers: [
    StatusBar,
    SplashScreen,
    IBeacon,
    BeaconProvider,
    Device,
    { provide: ErrorHandler, 
      useClass: IonicErrorHandler}
  ]
})
export class AppModule {}

Answer 1

我不是使用ionic3 cordova插件的专家，但我怀疑这不是您的测距结果的正确回调：

this.events.subscribe('didStartMonitoringForRegion', (data) => {

这似乎是一个回调，指示测距已成功开始，如果为true，则data.beacons未定义也就不足为奇了。您可能想从didRangeBeaconsInRegion回调中获取信标列表。

构建Ionic Cordova应用程序时无法拾取附近的信标

1 个答案: