微信小程序：通过腾讯地图获取用户地理位置信息及其行政区域代码

您所在的位置：网站首页 › 微信小程序如何获取用户信息 › 微信小程序：通过腾讯地图获取用户地理位置信息及其行政区域代码

微信小程序：通过腾讯地图获取用户地理位置信息及其行政区域代码

2023-04-18 18:39| 来源: 网络整理| 查看: 265

微信小程序：通过腾讯地图获取用户地理位置信息及其行政区域代码原创

彭世瑜 2023-04-18 10:36:48 ©著作权

文章标签微信小程序 git 开发者文章分类 JavaScript 前端开发 yyds干货盘点

©著作权归作者所有：来自51CTO博客作者彭世瑜的原创作品，请联系作者获取转载授权，否则将追究法律责任

文档：

wx.getLocation(Object object) 获取当前的地理位置、速度腾讯位置服务微信小程序JavaScript SDK 一、获取接口权限

根据腾讯地图文档需要完成以下几个步骤：

1、创建应用： https://lbs.qq.com/dev/console/application/mine

申请开发者密钥（key）填写微信小程序授权 APP ID 勾选WebserviceAPI 域名白名单

2、下载微信小程序JavaScriptSDK（如果地址失效请到官网下载）

https://mapapi.qq.com/web/miniprogram/JSSDK/qqmap-wx-jssdk1.2.zip 解压后放在目录

libs/qqmap-wx-jssdk.js

3、微信小程序后台添加安全域名

重要如果不添加request合法域名，测试版本正常，线上版本会获取不到数据

request合法域名 https://apis.map.qq.com 二、使用

单独提取出功能函数 utils/qq-map.js

/** * 腾讯地图微信小程序JS API * https://lbs.qq.com/miniProgram/jsSdk/jsSdkGuide/jsSdkOverview */ import QQMapWX from '../libs/qqmap-wx-jssdk.js'; // 申请开发者密钥（key） const QQMAP_KEY = 'xxx'; const qqmapsdk = new QQMapWX({ key: QQMAP_KEY, }); /** * 逆地址解析(坐标位置描述) * options: {location: {latitude: 纬度, longitude: 经度}} */ export function reverseGeocoder(options) { return new Promise((resolve, reject) => { qqmapsdk.reverseGeocoder({ ...options, success: resolve, fail: reject, }); }); }

使用 pages/index/index.js

import { reverseGeocoder } from '../../utils/qq-map.js'; async getIpInfo() { // 1、通过微信小程序获取当前位置坐标，需要用户点击授权按钮 const locationRes = await wx.getLocation({ type: 'wgs84', }); console.log(locationRes); if (locationRes.errMsg == 'getLocation:ok') { // 2、根据坐标获取位置的详细信息 const reverseRes = await reverseGeocoder({ location: { latitude: locationRes.latitude, longitude: locationRes.longitude, } }); console.log(reverseRes); // 行政区域码 let locationCode = reverseRes.result.ad_info.adcode; } },

如果用户未授权位置信息获取，可以降级使用ip获取用户位置信息 Python/PHP：免费IP归属地查询接口和通过ip获取大致位置信息

参考微信小程序--获取地理位置名称

打赏赞收藏评论分享举报

上一篇：Day.js轻量级 JavaScript 时间日期处理库可替代Moment.js

下一篇：微信小程序：uni-app页面Page和组件Component生命周期执行的先后顺序

【本文地址】

微信小程序：通过腾讯地图获取用户地理位置信息及其行政区域代码

微信小程序：通过腾讯地图获取用户地理位置信息及其行政区域代码

今日新闻

推荐新闻