1、需求說(shuō)明
需求：點(diǎn)擊按鈕獲取當(dāng)前微信位置，以及點(diǎn)擊拒絕授權(quán)后，下次點(diǎn)擊還可以拉起授權(quán)窗口；
2、言歸正傳
1、編寫代碼
模板部分
<template>
<view>
<button type="" @click="getLocation">獲取位置</button>
<view>經(jīng)度：{{x}}</view>
<view>緯度：{{y}}</view>
</view>
</template>
script部分
<script>
export default {
data () {
return {
x: 0,
y: 0
}
},
methods: {
getLocation () {
let that = this
// 獲取用戶是否開(kāi)啟 授權(quán)獲取當(dāng)前的地理位置、速度的權(quán)限。
uni.getSetting({
success (res) {
console.log(res)
// 如果沒(méi)有授權(quán)
if (!res.authSetting['scope.userLocation']) {
// 則拉起授權(quán)窗口
uni.authorize({
scope: 'scope.userLocation',
success () {
//點(diǎn)擊允許后--就一直會(huì)進(jìn)入成功授權(quán)的回調(diào) 就可以使用獲取的方法了
uni.getLocation({
type: 'wgs84',
success: function (res) {
that.x = res.longitude
that.y = res.latitude
console.log(res)
console.log('當(dāng)前位置的經(jīng)度：' + res.longitude)
console.log('當(dāng)前位置的緯度：' + res.latitude)
uni.showToast({
title: '當(dāng)前位置的經(jīng)緯度：' + res.longitude + ',' + res.latitude,
icon: 'success',
mask: true
})
}, fail (error) {
console.log('失敗', error)
}
})
},
fail (error) {
//點(diǎn)擊了拒絕授權(quán)后--就一直會(huì)進(jìn)入失敗回調(diào)函數(shù)--此時(shí)就可以在這里重新拉起授權(quán)窗口
console.log('拒絕授權(quán)', error)
uni.showModal({
title: '提示',
content: '若點(diǎn)擊不授權(quán)，將無(wú)法使用位置功能',
cancelText: '不授權(quán)',
cancelColor: '#999',
confirmText: '授權(quán)',
confirmColor: '#f94218',
success (res) {
console.log(res)
if (res.confirm) {
// 選擇彈框內(nèi)授權(quán)
uni.openSetting({
success (res) {
console.log(res.authSetting)
}
})
} else if (res.cancel) {
// 選擇彈框內(nèi) 不授權(quán)
console.log('用戶點(diǎn)擊不授權(quán)')
}
}
})
}
})
} else {
// 有權(quán)限則直接獲取
uni.getLocation({
type: 'wgs84',
success: function (res) {
that.x = res.longitude
that.y = res.latitude
console.log(res)
console.log('當(dāng)前位置的經(jīng)度：' + res.longitude)
console.log('當(dāng)前位置的緯度：' + res.latitude)
uni.showToast({
title: '當(dāng)前位置的經(jīng)緯度：' + res.longitude + ',' + res.latitude,
icon: 'success',
mask: true
})
}, fail (error) {
uni.showToast({
title: '請(qǐng)勿頻繁調(diào)用！',
icon: 'none',
})
console.log('失敗', error)
}
})
}
}
})
}
},
}
</script>
2、在manifest.json新增如下配置
原因：因?yàn)槲⑿判〕绦驈?019年1月14日起新提交發(fā)布的版本若未填寫地理位置用途說(shuō)明，則將無(wú)法正常調(diào)用地理位置相關(guān)接口；
解決辦法： 在manifest.json文件中，mp-weixin屬性下配置permission獲取地理位置的權(quán)限
"permission" : {
"scope.userLocation" : {
"desc" : "你的位置信息將用于小程序位置接口的效果展示"
}
},
"requiredPrivateInfos" : [ "chooseAddress", "getLocation", "chooseLocation" ]
3、運(yùn)行測(cè)試
點(diǎn)擊不授權(quán)
點(diǎn)擊授權(quán)，跳轉(zhuǎn)到授權(quán)頁(yè)面，修改為使用時(shí)允許
重新獲取位置信息
成功獲取到用戶的地理位置，那么就可以調(diào)用后端接口將經(jīng)緯度存儲(chǔ)到服務(wù)端使用了
3、結(jié)語(yǔ)
1.以上就是今天分享的全部?jī)?nèi)容，小伙伴們別忘記點(diǎn)贊關(guān)注~
2.需要注意的是一定要進(jìn)行在manifest.json文件中配置，否則會(huì)如下錯(cuò)誤
3.如果是需要上線的小程序，需要在微信公眾平臺(tái)開(kāi)發(fā)管理->接口設(shè)置中開(kāi)通接口wx.getLocation的權(quán)限，否則審核代碼時(shí)候會(huì)不通過(guò)文章來(lái)源：http://www.zghlxwxcb.cn/news/detail-850570.html
4.制作不易，一鍵四連再走吧，您的支持永遠(yuǎn)是我最大的動(dòng)力！文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-850570.html
到了這里，關(guān)于uniapp開(kāi)發(fā)小程序如何獲取用戶地理位置的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
