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>