uniapp?h5如何獲取用戶地理位置信息(使用高德地圖)
使用uni.getLocation()先獲取到當(dāng)前位置信息的經(jīng)緯度
H5端測(cè)試可以使用http，上線打包需要設(shè)置為https模式
谷歌瀏覽器可能會(huì)獲取不到任何信息，因?yàn)楣雀铻g覽器位置信息是連接谷歌服務(wù)器獲取的，國(guó)內(nèi)用戶可能獲取位置信息失敗
getCurrentlocation(){
let that = this
uni.getLocation({
type: 'wgs84',
isHighAccuracy: true,//開(kāi)啟高精度定位
success(res) {
console.log('當(dāng)前位置的經(jīng)度：' + res.longitude);
console.log('當(dāng)前位置的緯度：' + res.latitude);
}
})
}使用高德開(kāi)發(fā)平臺(tái)注冊(cè)一個(gè)key
高德開(kāi)發(fā)平臺(tái)：高德開(kāi)放平臺(tái) | 高德地圖API (amap.com)
拿到key在manifest.json里進(jìn)行配置
配置完成后使用高德的逆地理編碼對(duì)上面請(qǐng)求拿到的經(jīng)緯度進(jìn)行解析
turnAdrr(longitude, latitude) {
let that = this
let _key = '高德里你注冊(cè)的key'; //高德API key類型：web服務(wù)
uni.request({
method: 'GET',
url: 'https://restapi.amap.com/v3/geocode/regeo?parameters',
data: {
key: _key,
location: `${longitude},${latitude}`,
output: 'JSON',
},
success: (res) => {
console.log(res.data.regeocode.formatted_address);
//用戶所在的地理位置信息
},
fail: r => {
console.log(r);
}
});
}App的話可以直接調(diào)用uni.getLocation()拿到用戶的所在位置，不需要進(jìn)行解析，可以直接拿到
uni.getLocation({
type: 'gcj02', //app直接獲取地理位置信息要使用gcj02
geocode:true , //必須要將geocode配置為true
isHighAccuracy: true,
success(res) {
console.log(res.address)
},
fail(err){
console.log(err)
}
})總結(jié)
到此這篇關(guān)于uniapp h5如何獲取用戶地理位置信息的文章就介紹到這了,更多相關(guān)uniapp h5獲取用戶地理位置信息內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
這篇文章主要介紹了微信小程序用戶拒絕授權(quán)的處理方法詳解,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2019-09-09
淺談DOM的操作以及性能優(yōu)化問(wèn)題-重繪重排
下面小編就為大家?guī)?lái)一篇淺談DOM的操作以及性能優(yōu)化問(wèn)題-重繪重排。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-01-01
JavaScript 動(dòng)態(tài)生成方法的例子
動(dòng)態(tài)生成方法的例子，這些方法在新對(duì)象實(shí)例化的時(shí)候創(chuàng)建2009-07-07
UniApp中Scroll-View設(shè)置占滿下方剩余高度的方法記錄
在使用uniapp開(kāi)發(fā)項(xiàng)目過(guò)程中有時(shí)候會(huì)想讓一些組件占有屏幕剩余的高度,下面這篇文章主要給大家介紹了關(guān)于UniApp中Scroll-View設(shè)置占滿下方剩余高度的方法,需要的朋友可以參考下2023-04-04
Javascript實(shí)現(xiàn)快速排序（Quicksort）的算法詳解
排序算法（Sorting algorithm）是計(jì)算機(jī)科學(xué)最古老、最基本的課題之一，要想成為合格的程序員，就必須理解和掌握各種排序算法。2015-09-09
js獲取兩個(gè)數(shù)組對(duì)象的差集實(shí)現(xiàn)方法
這篇文章主要為大家介紹了js獲取兩個(gè)數(shù)組對(duì)象的差集實(shí)現(xiàn)方法,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-08-08
基于JavaScript的操作系統(tǒng)你聽(tīng)說(shuō)過(guò)嗎？
基于JavaScript的操作系統(tǒng)，你聽(tīng)說(shuō)過(guò)嗎？小編也是第一次聽(tīng)說(shuō)，接觸，和大家一起了解一下2016-01-01
這篇文章主要介紹了TypeScript 裝飾器定義，裝飾器是一種新的聲明，它可以作用于類聲明 、方法 、訪問(wèn)器 、屬性以及參數(shù)上，下面我們就來(lái)看看TypeScript 裝飾器的具體定義吧,需要的朋友可以參考一下，希望對(duì)你有所幫助2021-12-12
webpack 是一個(gè)現(xiàn)代 JavaScript 應(yīng)用程序的靜態(tài)模塊打包器(module bundler),下面這篇文章主要給大家介紹了關(guān)于webpack打包進(jìn)度展示以及美化的相關(guān)資料,文中通過(guò)實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-01-01
微信小程序通過(guò)點(diǎn)擊事件跨頁(yè)面?zhèn)鲄⒓癲ata-方法傳參（data-）的示例詳解
在?vue?中，我們可以直接在點(diǎn)擊事件中放入傳遞的參數(shù)進(jìn)行傳參；然而微信小程序中并不適用這樣的寫(xiě)法，但是微信小程序可以通過(guò)自定義屬性從而綁定參數(shù)使用，這篇文章主要介紹了微信小程序通過(guò)點(diǎn)擊事件跨頁(yè)面?zhèn)鲄⒁约癲ata-方法傳參（data-）,需要的朋友可以參考下2023-12-12