配置manifest.json

在微信小程序配置中，必须勾选位置接口，并且写明描述

manifest.json视图

manifest.json源码

"mp-weixin" : {"appid" : "wx***xxxxx*****","setting" : {"urlCheck" : false,"postcss" : true,"es6" : true,"minified" : true},"usingComponents" : true,"permission" : {"scope.userLocation" : {"desc" : "你的位置信息将用xxxxxxxxxxxx"}}},

授权请求authorize

authorize的作用，便是提前向用户发起授权请求。返回之前的授权结果：成功或者失败。一般搭配uni.getSetting和uni.openSetting使用。

关于openSetting具体可以戳这里~
关于authorize具体可以戳这里~

获取经纬度 getLocation

uni.authorize({scope: "scope.userLocation",success: () => {uni.showLoading({title: '定位中...' ,mask:true})uni.getLocation({type: "gcj02", //  wgs84: 返回GPS坐标，gcj02: 返回国测局坐标success: res => {console.log(res,'经纬度')}});},fail: () => {//console.log('请授权获取你的位置，否则部分功能将无法使用！')uni.showModal({//弹出提示框title: '是否打开设置页？',content: '请授权获取你的位置，否则部分功能将无法使用！',success(res) {if (res.confirm) {// 用户点击确定按钮uni.openSetting({// 确认后打开设置页面success(res) {// if(res.authSetting['scope.userLocation']){//  console.log("手动授权成功")// }else{//  console.log("手动授权失败")// }},fail(){console.log("打开设置页面失败")}})} else if (res.cancel) {// 用户点击取消按钮console.log('用户点击取消');}},fail(){console.log("确认取消弹出未弹出")}})},
});

到这里咱们就可以得到地理位置的经纬度，但是如果想获得详细的地理位置，还需要逆向解析一下

引入地图，逆向解析

这里咱们以小程序为例，所以引入腾讯地图。

注册账号（免费）

首先需要注册腾讯地图账号，获得key

创建新秘钥

开发者秘钥申请

key 设置

申请成功后，还需要详细配置一下，点击key列表设置按钮后，这里有4处重点，如图：

1、微信APP ID
2、勾选WebServiceAPI
3、选中 域名白名单，可以不在里面填写域名，不然校验失败一直提示无权限。

4、安全域名设置，在小程序管理后台 -> 开发 -> 开发管理 -> 开发设置 -> “服务器域名” 中设置request合法域名，添加https://apis.map.qq.com (这里很重要)

下载小程序SDK

拿到秘钥后，便需要引入腾讯地图SDK，下载地址戳这里~

JavaScriptSDK v1.1
JavaScriptSDK v1.2

或者参考具体文档~

引入SDK，最终代码

addressDetailFn (){const qqmapsdk = new QQMapWX({ key: "Mxxx-xxx-xxxx--地图秘钥" });//提前获得授权结果uni.authorize({scope: "scope.userLocation",//已同意授权success: () => {//开启loading，防止多次触发uni.showLoading({title: '定位中...' ,mask:true})//获得经纬度uni.getLocation({type: "gcj02", //  wgs84: 返回GPS坐标，gcj02: 返回国测局坐标success: res => {const {latitude, longitude} = res;const location = {latitude, longitude};// 传入经纬度，逆向解析qqmapsdk.reverseGeocoder({location,success: (res) =>{//关闭loadinguni.hideLoading();//最终地址let ad_info = res.result.ad_info || {};let address = ad_info.province+'-'+ad_info.city+'-'+ad_info.district;let detailAddress = res.result.formatted_addresses.recommendconsole.log(address,'省市县')console.log(detailAddress,'详细的地址')},fail :(e)=>{uni.hideLoading();}});},fail :(e)=>{//这里也很重要，有可能用户关闭了GPS，虽然可以定位，但是没有位置信息uni.hideLoading();uni.showModal({content:'位置定位失败，请检查您的GPS是否开启',showCancel:false,confirmText:'知道了'})console.log(e,'获取经纬度')}});},// 拒绝了授权fail: () => {uni.showModal({//弹出提示框title: '是否打开设置页？',content: '请授权获取你的位置，否则部分功能将无法使用！',success(res) {if (res.confirm) {// 用户点击确定按钮uni.openSetting({// 确认后打开设置页面success(res) {// if(res.authSetting['scope.userLocation']){//  console.log("手动授权成功")// }else{//  console.log("手动授权失败")// }},fail(){console.log("打开设置页面失败")}})} else if (res.cancel) {// 用户点击取消按钮console.log('用户点击取消');}},fail(){console.log("确认取消弹出未弹出")}})},});}

这样便能拿到详细的地理位置了，大家可能对于我拼接的最终具体地址有疑惑，这里可以根据需求自行拼接，具体参数值，戳这里~

微信小程序 -- 授权地理位置相关推荐

微信小程序授权地理位置被拒绝后 wx.getLocation接口调用失败问题
最近在开发小程序,需要用到位置信息. 但总有那么一小部分人会点击拒接授权,然后小程序就用不了了.因为是根据所在的城市信息来加载数据,所以就需要引导用户自己打开地理位置授权.像下图废话不多说直接上代码 ...
微信小程序获取地理位置，用户未开启手机定位时的解决方案
要点:获取地理位置时,如果获取地理位置失败,有两种情况: 1.用户未给小程序授权地理位置信息 2.系统设置中-隐私选项地理位置未开启或系统未给微信授权地理位置信息在获取地理位置信息失败后,判断用户是 ...
微信小程序获取地理位置失败原因及解决方案
微信小程序获取用户地理位置失败的原因主要有3种情况: 1. 手机系统设置中地理位置未开启 2. 系统未给微信app授权 3. 用户未给小程序授权地理位置信息所以需要继续完善下定位失败的处理逻辑. 1 ...
微信小程序授权登录组件的封装
微信小程序授权登录组件的封装新建components文件写wxml文件 wxss部分 js部分 json引用页面使用页面js 授权登录流程如下: 因为多个页面功能需要登录状态所以做了个组 ...
微信小程序---授权保存图片或视频，拒绝后不在出现弹窗---自定义组件弹窗
微信小程序授权保存图片后拒绝授权,(当拒绝授权后,微信再次调用保存不在出现授权弹窗): 这么一来,微信提供给开发者的解决方法就是跳入设置页面里面让用户自己打开权限. 那么今天自己自定义了一个组件. 根 ...
SpringBoot微信小程序授权登录
SpringBoot微信小程序授权登录一.appId 1.1.自己是管理者:微信公众平台,申请或登录自己的微信小程序,在开发者管理中即可看到 2.2.自己是开发者:让管理员将自己加入到小程序开发者管 ...
uniapp微信小程序授权登录和获取微信绑定的手机号码
uniapp微信小程序授权登录和获取微信绑定的手机号码弹出授权的弹框 <view class="weixinOk" @tap="getUserProfile&qu ...
微信小程序授权登录取消授权重新授权处理方法附可用代码
微信小程序授权登录基本是小程序的标配了,但是官方的demo,取消授权后,就不能再重新点击登录,除非重新加载小程序才可以,这下怎么办? 我们可以先在首页引导用户点击,然后跳转到一个新的页面,在新的页面进 ...
圆头像微信小程序绘图_[微信小程序]授权头像修改圆形
"#[一如分算需上来处一定迹面数一跳这件我子作微信小程序]授权头新直能分支调二浏页器朋代说,事刚需求像修改圆形" 一. .wxml .wxss .userinfo-avatar { ...
新版微信小程序授权登录流程及问题汇总（getUserProfile）
问题来源:前不久去面试的时候有面试官问我你有自己的博客啥的吗?只能很尴尬的说没有.其实一直想有一个属于自己的博客啥的去记录自己在开发过程中遇到的问题,正好现在微信小程序比较流行,就花了两天自己搞了一个 ...

微信小程序 -- 授权地理位置

授权地理位置