最近搜索

小程序 获取用户经度纬度 使用腾讯地图换取位置信息。

浏览:8
管理员 2025-06-27 10:09



小程序 wx.getLocation比较难申请。可以使用wx.getFuzzyLocation 代替   

  "requiredPrivateInfos": ["getFuzzyLocation" ],
  "permission": {
    "scope.userFuzzyLocation": {
      "desc": "你的位置信息将用于,订单创建"
    }
  }





此案例用的这个接口。

image.png





官方案例  提供一个搜索的案例

// 引入SDK核心类,js文件根据自己业务,位置可自行放置
var QQMapWX = require('../../utils/qqmap-wx-jssdk1.2/qqmap-wx-jssdk.js');
var qqmapsdk;
Page({
  data: {},
  onLoad(options) {
    qqmapsdk = new QQMapWX({
      key: '2JXBZ-MWBEZ-HVLXB-7WXUC-C6HXQ-PNFRK'
    });
  },
  onReady() {},
  onShow() {
    // 调用接口
    qqmapsdk.search({
      keyword: '酒店',
      success: function (res) {
        console.log(res);
      },
      fail: function (res) {
        console.log(res);
      },
      complete: function (res) {
        console.log(res);
      }
    });
  },
  onHide() {},
  onUnload() {},
  onPullDownRefresh() {},
  onReachBottom() {},
  onShareAppMessage() {}
})

image.png





开通getLocation 权限  和  安全域名设置

小程序后台开通。

安全域名设置,在小程序管理后台 -> 开发 -> 开发管理 -> 开发设置 -> “服务器域名” 中设置request合法域名,添加https://apis.map.qq.com



注册腾讯位置服务


https://lbs.qq.com/


创建应用。分配额度,每日使用额度。

您使用的 qqmapsdk.reverseGeocoder 是腾讯位置服务提供的‌逆地址解析(坐标转地址)接口()


image.png




绑定小程序 使用ip授权。

image.png

最好是使用签名授权。  这样就避免了ip频繁换的问题。






下载sdk 小小程序用

https://lbs.qq.com/miniProgram/jsSdk/jsSdkGuide/jsSdkOverview


image.png

image.png

image.png




书写代码  key可以后台获取。 方便我们换key

// 引入SDK核心类,js文件根据自己业务,位置可自行放置
var QQMapWX = require('../../utils/qqmap-wx-jssdk1.2/qqmap-wx-jssdk.js');
var qqmapsdk;

Page({
  data: {},
  onLoad(options) {
    qqmapsdk = new QQMapWX({
      key: '2JXBZ-MWBEZ-HVLXB-7WXUC-C6HXQ-*****'
    });
  },
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {
    // 调用接口
    wx.getLocation({
      type: 'gcj02', // 必须为 gcj02 坐标系
      success: (res) => {
        console.log(res);
        const {
          latitude,
          longitude
        } = res;
        qqmapsdk.reverseGeocoder({
          location: {
            latitude,
            longitude
          },
          success: (addressRes) => {
            console.log('详细地址:', addressRes.result.address);
            // 输出示例:北京市海淀区中关村大街
          },
          fail: function (res) {
            console.log(res);
          }
        });
      }
    });
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  }
})



{latitude: 34.16717, longitude: 112.84437, speed: -1, accuracy: 65, verticalAccuracy: 65, …}
vip.js? [sm]:36 详细地址: 河南省平顶山市汝州市丹阳中路





核心接口如下

https://lbs.qq.com/miniProgram/jsSdk/jsSdkGuide/qqMapwx


image.png


方法返回值说明
search(options:Object)none地点搜索,搜索周边poi,比如:“酒店” “餐饮” “娱乐” “学校” 等等
getSuggestion(options:Object)none用于获取输入关键字的补完与提示,帮助用户快速输入
reverseGeocoder(options:Object)none提供由坐标到坐标所在位置的文字描述的转换。输入坐标返回地理位置信息和附近poi列表
geocoder(options:Object)none提供由地址描述到所述位置坐标的转换,与逆地址解析的过程正好相反
direction(options:Object)none提供驾车,步行,骑行,公交的路线规划能力
getCityList()none获取全国城市列表数据
getDistrictByCityId(options:Object)none通过城市ID返回城市下的区县
calculateDistance(options:Object)none计算一个点到多点的步行、驾车距离




联系站长

站长微信:xiaomao0055

站长QQ:14496453