Ionic 2 - 地理位置超时错误

Question

我想每次点击按钮时检测经度和纬度。 我试图搜索许多网站和博客，但没有得到任何具体的解决方案。 我还安装了科尔多瓦，插件，地理位置和使用这样的：

import { Component } from '@angular/core'; 
import { IonicPage, NavController, NavParams, Platform } from 'ionic-angular'; 
import {Camera, CameraOptions} from '@ionic-native/camera'; 
import { Geolocation, Geoposition } from '@ionic-native/geolocation'; 

constructor(public navCtrl: NavController, public navParams: NavParams, private camera : Camera, 
    public geolocation: Geolocation, public platform: Platform) { 
    } 

capturePhotos() 
{ 
    let GPSoptions = {timeout: 10000, enableHighAccuracy: true, maximumAge: 3600}; 
     this.geolocation.getCurrentPosition(GPSoptions).then((position) => { 

     console.log("IN"); 

     console.log(position.coords.latitude); 
     console.log(position.coords.longitude); 

     }, (error) => 
     { 
     console.log('Error getting location', error); 
     }); 
} 

得到超时错误后，我增加了超时50000，但没有成功。 以上capturephoto功能将在下面叫：

<ion-navbar hideBackButton side="left"> 
     <ion-title style="margin-left: 0px;"> 
      <div> 
       <ion-icon ios="ios-add" md="md-add" class="menuIcon" (click)="capturePhotos()"></ion-icon><span class="menuTitle">My Photos</span> 
      </div> 
     </ion-title> 
    </ion-navbar> 

当我尝试在Android模拟器上运行它，它会获取纬度长，当我第一次点击添加图标，但是当我点击第二个或更多的时间停止工作，并引发错误： PositionError {}码：3消息：“超时过期”

Answer 1

我做了以下更改解决此问题：

1）设置我的位置模式，以高准确度在我手机设置。

2）之后，我将代码从“this.geolocation”更改为 “navigator.geolocation”。

3）我的代码中有一些问题与回调。当检测到经纬度时，我正在调用另一个函数，并且正在重定向到新页面。所以解决了这个回调问题，之后我每次点击按钮都会成功获取纬度值。

Answer 2

有这个答案phonegap geolocation allways fail on timeout，

你的代码似乎要被罚款，但是，开始，尝试为getPosition没有选择（默认选项）

Answer 3

这不是一个理想的解决方案（使用watchPosition），但它适用于我在iOS上，它应该为你工作。

home.ts

import {Component} from '@angular/core'; 
import {Platform, NavController} from 'ionic-angular'; 
import {Geolocation, Geoposition} from '@ionic-native/geolocation'; 

import 'rxjs/add/operator/filter'; 
import {last} from "rxjs/operator/last"; 

@Component({ 
    selector: 'page-home', 
    templateUrl: 'home.html' 
}) 
export class HomePage { 
    latest: Geoposition; 
    displayed: Geoposition; 
    timestamp: number = 0; 

    constructor(private platform: Platform, public navCtrl: NavController, private geolocation: Geolocation) { 
    this.latest = { 
     coords: { 
     altitude: 0, 
     heading: 0, 
     latitude: 0, 
     longitude: 0, 
     accuracy: 0, 
     altitudeAccuracy: 0, 
     speed: 0 
     }, 
     timestamp: 0 
    }; 
    this.displayed = this.latest; 
    this.platform.ready() 
     .then(() => { 

     const subscription = this.geolocation.watchPosition({ 
      enableHighAccuracy: true, 
      maximumAge: 8000, 

     }) 
      .filter((p) => p.coords !== undefined) //Filter Out Errors 
      .subscribe(position => { 
      if (position.coords !== undefined) { 
       this.latest = position; 
      } 

      }); 

     }); 

    } 

    refreshLocation() { 
    this.displayed = this.latest 
    } 

} 

home.html的

<ion-header> 
    <ion-navbar> 
    <ion-title> 
     Movement information 
    </ion-title> 
    </ion-navbar> 
</ion-header> 

<ion-content padding> 
    <button ion-button (click)="refreshLocation()" full>Update</button> 
    <ion-list> 
    <ion-item no-padding no-margin> 
     time: {{timestamp}} 
    </ion-item> 
    <ion-item no-padding no-margin> 
     lat: {{displayed.coords.latitude}} 
    </ion-item> 
    <ion-item no-padding no-margin> 
     long: {{displayed.coords.longitude}} 
    </ion-item> 
    <ion-item no-padding no-margin> 
     altitude: {{displayed.coords.altitude}} 
    </ion-item> 
    <ion-item no-padding no-margin> 
     heading: {{displayed.coords.heading}} 
    </ion-item> 
    <ion-item no-padding no-margin> 
     speed: {{displayed.coords.speed}} 
    </ion-item> 
    </ion-list> 
</ion-content>