微信小程序: 用户拒绝获取定位信息后如何再次获得

获取用户定位信息是小程序比较常用的功能,而且很多需求是一进入就需要拿到定位的信息,所以很多小程序都是打开后就有个询问弹窗

这时候有些人会点【取消】,就拿不到定位信息了,而且小程序的特殊运行机制,只要你点取消了,以后每次进来都是默认拒绝了,也就是说,以后进来都拿不到定位信息了,必须要把小程序删除后再次进入才会弹窗询问,这给我们开发者带来了很多烦恼。

怎么解决呢,我们可以用微信小程序提供的API wx.openSetting(Object object)

 

wx.openSetting(Object object)

支持版本 >= 1.1.0

调起客户端小程序设置界面,返回用户设置的操作结果。设置界面只会出现小程序已经向用户请求过的权限

注意:2.3.0 版本开始,用户发生点击行为后,才可以跳转打开设置页,管理授权信息。

调用打开后的界面如下:

看到里面都是已经向用户请求过的权限,可以把地理位置设置为允许。返回后再次调用getLocation接口就可以拿到定位信息了。

上个简单的代码

<!--index.wxml-->
<button bindtap='toSetting'>重新定位</button>
//index.js
toSetting() {
    wx.openSetting({
      success(res) {
        console.log(res.authSetting)
        if (res.authSetting["scope.userLocation"]) {
          // res.authSetting["scope.userLocation"]为trueb表示用户已同意获得定位信息,此时调用getlocation可以拿到信息
          wx.getLocation({
            type: 'wgs84',
            success(res) {
              const latitude = res.latitude
              const longitude = res.longitude
              const speed = res.speed
              const accuracy = res.accuracy
            }
          })
        }
      }
    })
  },

还一种方式是直接用button组件

<!--index.wxml-->
<button open-type='openSetting' bindopensetting="openSetting">重新定位</button>
//index.js
 openSetting(e) {//跳转授权设置之后的回调
    if (e.detail.authSetting['scope.userLocation']) { //此处同上同理
      wx.getLocation({
        type: 'wgs84',
        success(res) {
          const latitude = res.latitude
          const longitude = res.longitude
          const speed = res.speed
          const accuracy = res.accuracy
        }
      })
    }
  },    

 

### 实现 Vue3 微信小程序中通过腾讯地图 API 获取用户定位 在 Vue3 开发的微信小程序中集成腾讯地图以实现定位功能,可以通过以下方式完成: #### 1. **申请腾讯地图密钥** 需要先前往腾讯云官网注册账号并创建应用,获取到腾讯地图的 `Key`。此 Key 将用于后续调用腾讯地图的相关接口[^1]。 #### 2. **引入腾讯地图 SDK** 在项目中的合适位置(通常是公共目录下),下载并引入腾讯地图的小程序插件 `qqmap-wx-jssdk.js` 文件。可以在某个 `.vue` 文件中这样操作: ```javascript import QQMapWX from '@/libs/qqmap-wx-jssdk.js'; ``` 上述代码片段展示了如何正确加载腾讯地图的 JavaScript 插件[^3]。 #### 3. **请求用户地理位置权限** 使用 `uni.authorize` 方法向用户请求地理定位权限。如果用户拒绝授权,则可以引导其手动开启设置页面来重新授予权限。 ```javascript // 请求授权 uni.authorize({ scope: 'scope.userLocation', success() { console.log('用户已同意授权'); }, fail() { // 用户未授权,跳转至设置页 uni.showModal({ title: '提示', content: '需要您授予地理位置权限才能正常使用本功能', confirmText: '去设置', cancelText: '取消', success(modalRes) { if (modalRes.confirm) { uni.openSetting(); } } }); } }); ``` 以上方法确保了用户的隐私安全,并遵循了微信小程序对于敏感数据访问的规定。 #### 4. **获取当前设备的位置信息** 调用微信小程序自带的 `getLocation` 接口获取当前位置的经纬度。随后可通过这些坐标进一步查询具体地址或其他相关内容。 ```javascript const getLocationData = () => { return new Promise((resolve, reject) => { uni.getLocation({ type: 'wgs84', // 返回 GPS 坐标,默认gcj02 geocode: true, success(res) { resolve(res); }, fail(err) { reject(err); } }); }); }; ``` 这里采用了基于 `Promise` 的封装形式简化异步处理逻辑[^4]。 #### 5. **逆地理编码转换为实际地址** 利用之前导入的 `QQMapWX` 对象实例化服务类,并传入初始化参数——即前面提到过的腾讯地图秘钥 (`key`) 。接着执行反向地理编解码过程将原始坐标映射成人类可读的文字描述。 ```javascript const qqmapsdk = new QQMapWX({ key: '您的腾讯地图KEY' }); async function getFormattedAddress(latlng) { try { const result = await new Promise((res, rej) => { qqmapsdk.reverseGeocoder({ location: latlng, success(result) { res(result.result.address); // 地址详情字符串 }, fail(error) { rej(error.errMsg || error.message); } }); }); return result; } catch (e) { throw e; } } ``` 这段脚本实现了从经纬度到详细街道名称之间的相互转化。 --- ### 总结 综上所述,在 Vue3 构建的微信小程序里借助腾讯地图 API 完成精确定位主要分为五个阶段:首先是取得合法有效的腾讯地图钥匙;其次是把官方提供的 JS 库嵌入工程结构之中;再次是妥善管理好必要的运行许可声明;第四步则是精确捕获目标地点的确切空间座标数值;最后一步便是运用专业的算法工具把这些抽象的数据转变为我们日常生活中熟悉的实体参照物表述出来^。 ---
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值