微信小程序授权获取地理位置问题

配置过程:
1、在腾讯平台申请自己的秘钥(申请地址:http://lbs.qq.com/console/mykey.html)

2、小程序平台设置request安全域名

  • https://apis.map.qq.com
  • 微信小程序授权获取地理位置问题_第1张图片
  • 3、下载小程序js微信小程序JavaScriptSDK v1.0      引入自己的文件 链接地址:http://3gimg.qq.com/lightmap/xcx/jssdk/qqmap-wx-jssdk1.0.zip
  • 将文件一如自己的项目目录内
  • 微信小程序授权获取地理位置问题_第2张图片
  • 代码示例:
    //index.js
    //获取应用实例
    const app = getApp();
    var QQMapWX = require('../../utils/qqmap-wx-jssdk.min.js');
    var qqmapsdk;
    Page({
      data: {
        province: '',
        city: '',
        latitude: '',
        longitude: ''
      },
      onLoad: function () {
        qqmapsdk = new QQMapWX({
          key: 'xxxx-xxxx-xxxx-xxxx' //自己的key秘钥 http://lbs.qq.com/console/mykey.html 在这个网址申请
        });
      },
      onShow: function () {
        let vm = this;
        vm.getUserLocation();
      },
      getUserLocation: function () {
        let vm = this;
        wx.getSetting({
          success: (res) => {
            console.log(JSON.stringify(res))
            // res.authSetting['scope.userLocation'] == undefined    表示 初始化进入该页面
            // res.authSetting['scope.userLocation'] == false    表示 非初始化进入该页面,且未授权
            // res.authSetting['scope.userLocation'] == true    表示 地理位置授权
            if (res.authSetting['scope.userLocation'] != undefined && res.authSetting['scope.userLocation'] != true) {
              wx.showModal({
                title: '请求授权当前位置',
                content: '需要获取您的地理位置,请确认授权',
                success: function (res) {
                  if (res.cancel) {
                    wx.showToast({
                      title: '拒绝授权',
                      icon: 'none',
                      duration: 1000
                    })
                  } else if (res.confirm) {
                    wx.openSetting({
                      success: function (dataAu) {
                        if (dataAu.authSetting["scope.userLocation"] == true) {
                          wx.showToast({
                            title: '授权成功',
                            icon: 'success',
                            duration: 1000
                          })
                          //再次授权,调用wx.getLocation的API
                          vm.getLocation();
                        } else {
                          wx.showToast({
                            title: '授权失败',
                            icon: 'none',
                            duration: 1000
                          })
                        }
                      }
                    })
                  }
                }
              })
            } else if (res.authSetting['scope.userLocation'] == undefined) {
              //调用wx.getLocation的API
              vm.getLocation();
            }
            else {
              //调用wx.getLocation的API
              vm.getLocation();
            }
          }
        })
      },
      // 微信获得经纬度
      getLocation: function () {
        let vm = this;
        wx.getLocation({
          type: 'wgs84',
          success: function (res) {
            console.log(JSON.stringify(res))
            var latitude = res.latitude
            var longitude = res.longitude
            var speed = res.speed
            var accuracy = res.accuracy;
            vm.getLocal(latitude, longitude)
          },
          fail: function (res) {
            console.log('fail' + JSON.stringify(res))
          }
        })
      },
      // 获取当前地理位置
      getLocal: function (latitude, longitude) {
        let vm = this;
        qqmapsdk.reverseGeocoder({
          location: {
            latitude: latitude,
            longitude: longitude
          },
          success: function (res) {
            // console.log(JSON.stringify(res));
            let province = res.result.ad_info.province
            let city = res.result.ad_info.city
            vm.setData({
              province: province,
              city: city,
              latitude: latitude,
              longitude: longitude
            })
     
          },
          fail: function (res) {
            console.log(res);
          },
          complete: function (res) {
            // console.log(res);
          }
        });
      }
    })
    出现问题:配置完成时一直提示:
  • 小程序一直提示请求来源未被授权, 此次请求来源域名:servicewechat.com
  • 解决:微信小程序授权获取地理位置问题_第3张图片
  • 在域名白名单这里一定去掉域名,否则出现上述错误

你可能感兴趣的:(微信小程序授权获取地理位置问题)