ionic4 集成高德地圖

1.ionic項目打包apk，通過apk查看對應的sha1簽名（可以通過androstudio，或者解壓apk，cmd命令行進入\META-INF文件夾，執行keytool -printcert -file CERT.RSA可查看），在高德地圖獲取key中 ，發佈版安全sha1和調試版安全碼都用這個，這樣就可以獲取正確的key（之前不懂在這個key上花了好久時間）

 

2給ionic項目搭建高德地圖環境

cordova plugin add https://github.com/DaiHuaXieHuaKai/GaoDeLocation.git --variable API_KEY=xxxxx（高德地圖申請的key）

npm install @ionic-native/gao-de-location

然後就是引用了 

app.module.ts

import { GaoDeLocation } from '@ionic-native/gao-de-location/ngx';
@NgModule({
...
  providers: [ 
    GaoDeLocation,
    .....
  ],
  ...
})

在需要的組件或者頁面
xxx.ts

import { GaoDeLocation,PositionOptions,LocationProtocolEnum,LocationModeEnum,DesiredAccuracyEnum,PositionRes } from '@ionic-native/gao-de-location/ngx';

constructor( public gaoDeLocation: GaoDeLocation) {}

//await this.gaoDeLocation.getCurrentPosition....   需要放在async 類型的方法裏面
 async loc1(){
//引用高德插件獲取定位  
//可以參考該鏈接 https://ionicframework.com/docs/native/gao-de-location
//我這邊的cordova 安裝插件方法不一樣  之前用文檔這個好像生成的插件有問題 就換成上面git獲取那種方法
      let  positionOptions: PositionOptions = {
        androidOption: {
         locationMode: LocationModeEnum.Hight_Accuracy,
         gpsFirst: false,
          HttpTimeOut: 30000,
          interval: 2000,
          needAddress: true,
          onceLocation: false,
          onceLocationLatest: false,
          locationProtocol: LocationProtocolEnum.HTTP,
          sensorEnable: false,
          wifiScan: true,
          locationCacheEnable: true
        }, iosOption: {
          desiredAccuracy: DesiredAccuracyEnum.kCLLocationAccuracyBest,
          pausesLocationUpdatesAutomatically: 'YES',
          allowsBackgroundLocationUpdates: 'NO',
          locationTimeout: 10,
          reGeocodeTimeout: 5,
        }
      };  
    
     let positionRes: PositionRes = await this.gaoDeLocation.getCurrentPosition(positionOptions).catch((e: any) => {
      console.log(e);
    }) || null;

    alert(JSON.stringify(positionRes))
    // this.gaoDeLocation.getCurrentPosition(positionOptions).catch((e: any) => {
    //   console.log(e);
    // }) || null;
  }

調用代碼裏面的loc1()就可以獲取當前定位，這是要在手機上纔可以，瀏覽器上打印出null，（模擬器沒試過）

以上可以打出內容

有一個需要注意的是（如果不需要修改高德插件的key以下內容就無所謂）：如果一開始

cordova plugin add https://github.com/DaiHuaXieHuaKai/GaoDeLocation.git --variable API_KEY=xxxxx（高德地圖申請的key）

高德key錯了 要重新修改，需要移除這個插件，細節就是移除的時候要帶上之前的 高德key，不然就相當於卸載失敗（雖然 cordova plugn ls 已經沒有該插件（com.zhaoying.GaoDeLocation）了，但實際上沒有刪除乾淨），哪怕可以重新添加新key的插件（cordova plugin add https://github.com/DaiHuaXieHuaKai/GaoDeLocation.git --variable API_KEY=新key），這個新key也會不起作用，我在這裏坑了好久（因爲直接移除，cordova plugin rm com.zhaoying.GaoDeLocation，沒帶舊key，打包apk的時候會在生成的android項目的AndroidManifest.xml裏面，  <meta-data android:name="com.amap.api.v2.apikey" android:value="5xxxxxbb" />自動生成value是之前的key而不是新的，這表明原本的key信息沒被移除）

正確移除方法如下：

cordova plugin rm com.zhaoying.GaoDeLocation -variable API_KEY=舊keyxxxxx（之前安裝的高德key）

然後再重新裝

cordova plugin add https://github.com/DaiHuaXieHuaKai/GaoDeLocation.git --variable API_KEY=新keyxxxxx