背景地理位置：Promise<any> 类型不存在订阅

Question

我正在使用 ionic 4，并尝试从 GPS 获取用户位置，特别是每 1 小时间隔一次。所以它是一个每小时跟踪用户位置的应用程序。

我从他们的官方网站上使用了 Ionic 4 背景位置插件文档，并找到了安装这个插件的代码，它说这个插件即使在应用程序退出时也会运行，所以我希望它是我需要的。

我已使用以下代码将 Background-Geolocation 插件安装到 Ionic 4 应用程序：

ionic cordova plugin add cordova-plugin-mauron85-background-geolocation@alpha
npm install @ionic-native/background-mode

但是当我尝试测试它之后，在我的 app.component.ts 主文件中，代码失败了！

this.platform.ready().then(() => { 

      this.statusBar.styleDefault();
      this.splashScreen.hide();

      //setting options for backgroun-geolocatuion
      const config: BackgroundGeolocationConfig = {
        desiredAccuracy: 10,
        stationaryRadius: 20,
        distanceFilter: 30,
        debug: true, 
        stopOnTerminate: false,  
     };



      this.backgroundGeolocation.configure(config)
      .subscribe((location: BackgroundGeolocationResponse) => {

      // ERROR comes here ==> *subscribe* does not exist on type Promise<any> ???  

        alert(location.longitude);  
      });

      this.backgroundGeolocation.start();

    });

它显示了这个错误：

 // ERROR comes here ==> Subscribe does not exist on type Promise<any>

由于此错误，我无法将返回的数据作为订阅数据获取。我需要每 1 小时间隔一次的用户位置数据（即使用户移动与否），但此订阅显示错误，如上所述。

如果我将subscribe 更改为then，那么它会返回一次数据，这太未定义了。

我需要此代码与订阅一起运行，以每小时获取定期跟踪的用户信息。

我已经在代码上方和主模块文件中导入了所有提供程序和构造函数。

进口：

app/app.component.ts

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { RouteReuseStrategy } from '@angular/router';

import { IonicModule, IonicRouteStrategy } from '@ionic/angular';
import { SplashScreen } from '@ionic-native/splash-screen/ngx';
import { StatusBar } from '@ionic-native/status-bar/ngx';

import { AppComponent } from './app.component';
import { AppRoutingModule } from './app-routing.module';
import { BackgroundGeolocation } from '@ionic-native/background-geolocation/ngx';

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

Answer 1

this.backgroundGeoLocation.configure(config) 仅用于配置地理位置，它是一个指示配置成功或失败的承诺。

首先安装以下：

ionic cordova plugin add cordova-plugin-geolocation
npm install --save @ionic-native/geolocation
ionic cordova plugin add cordova-plugin-mauron85-background-geolocation
npm install --save @ionic-native/background-geolocation

现在将它们包含在您的提供程序中

app.module.ts

import {LocationTrackerProvider} from '../providers/location.provider';
import { BackgroundGeolocation } from '@ionic-native/background-geolocation';
import { Geolocation } from '@ionic-native/geolocation';

创建location.provider.ts（在app.module.ts中添加）

location.provider.ts

import { BackgroundGeolocation } from '@ionic-native/background-geolocation';
import { Geolocation, Geoposition } from '@ionic-native/geolocation';

constructor(private backgroundGeolocation: BackgroundGeolocation){}

initLocation(){

    let config = {
        ...
    };

    this.backgroundGeolocation.configure(config).subscribe((location) => {
      console.log('BackgroundGeolocation:  ' + location.latitude + ',' + location.longitude);

    }, (err) => {
      console.log(err);
    });

}

Answer 2

这似乎是版本不匹配——大量版本和相互冲突的文档。经过多次试错，

对于离子 3 这对我有用...

$ ionic cordova plugin add cordova-plugin-mauron85-background-geolocation@2.2.5
$ npm install --save @ionic-native/background-geolocation@3

对于离子 4 试试吧，它可能对你有帮助。

Answer 3

Mayank 的回答帮助了我，但是，2.2.5 版生成不成功的构建并导致以下错误-

AAPT：错误：找不到资源 android:attr/fontVariationSettings。

我会推荐-

$ ionic cordova plugin add cordova-plugin-mauron85-background-geolocation@2.3.5
$ npm install --save @ionic-native/background-geolocation@3

链接：https://ionic.zendesk.com/hc/en-us/articles/360001961853-Ionic-Appflow-Android-package-build-fails-with-AAPT-error

希望这对某人有所帮助。

Answer 4

Ionic 4 中的实现已更改，您可以查看 Ionic 4 的文档。 他们一定已经更新了它以保证我们现在不能订阅。 then 与 promise 一起使用。

https://ionicframework.com/docs/native/background-geolocation/

对于 Ionic 4

以下是解决此问题的代码 sn-p

import { BackgroundGeolocation, BackgroundGeolocationConfig, BackgroundGeolocationResponse } from '@ionic-native/background-geolocation';

constructor(private backgroundGeolocation: BackgroundGeolocation) { }

...

const config: BackgroundGeolocationConfig = {
            desiredAccuracy: 10,
            stationaryRadius: 20,
            distanceFilter: 30,
            debug: true, //  enable this hear sounds for background-geolocation life-cycle.
            stopOnTerminate: false, // enable this to clear background location settings when the app terminates
    };

this.backgroundGeolocation.configure(config)
  .subscribe((location: BackgroundGeolocationResponse) => {

    console.log(location);

    // IMPORTANT:  You must execute the finish method here to inform the native plugin that you're finished,
    // and the background-task may be completed.  You must do this regardless if your HTTP request is successful or not.
    // IF YOU DON'T, ios will CRASH YOUR APP for spending too much time in the background.
    this.backgroundGeolocation.finish(); // FOR IOS ONLY

  });

// start recording location
this.backgroundGeolocation.start();

// If you wish to turn OFF background-tracking, call the #stop method.
this.backgroundGeolocation.stop();

对于 Ionic 3，如果后台地理定位插件中出现此错误。

// ERROR comes here ==> Subscribe does not exist on type Promise<any>

删除最新的插件并替换为

npm rm --save @ionic-native/background-geolocation  
npm install --save @ionic-native/background-geolocation@5.0.0-beta.21 

Answer 5

this.backgroundGeolocation.configure(config).then((location) => { this.backgroundGeolocation.on(BackgroundGeolocationEvents.location).subscribe((位置：BackgroundGeolocationResponse) => { console.log('BackgroundGeolocationResponse', 位置); }, (错误) => { 控制台日志（错误）； })

Answer 6

我遇到了这个问题，发现文档不正确。

你需要从@ionic-native/background-geolocation/ngx而不是@ionic-native/background-geolocation导入。

这将允许订阅。