14.微信小程序之地理定位功能

目录

1.地理定位介绍

 1.1 申请开通

1.2 使用方法

2.拒绝授权后的解决方案  

3.开通腾讯位置服务

4.LBS 逆地址解析


1.地理定位介绍

小程序地理定位是指通过小程序开发平台提供的 API,来获取用户的地理位置信息。用户在使用小程序时,可以授权小程序获取自己的地理位置信息

  1. wx.getLocation() :获取当前的地理位置

  2. wx.chooseLocation():打开地图选择位置  

 1.1 申请开通

暂时只对部分类目的小程序开放,需要先通过类目审核,然后在小程序管理后台,「开发」-「开发管理」-「接口设置」中自助开通该接口权限。

1.2 使用方法
  1. 在 app.json 中配置 requiredPrivateInfos 进行声明启用

  2. 在调用 wx.getLocation() 时需要在 app.json 配置 permission字段,同时使用 scope.userLocation 声明收集用户选择的位置信息的目的,wx.chooseLocation() 接口不需要配置该字段,可以直接进行调用

  3. 在配置好以后,调用 wx.getLocation()wx.chooseLocation() 接口

app.json 中进行配置

{"requiredPrivateInfos": ["getLocation","chooseLocation"],"permission": {"scope.userLocation": {"desc": "获取用户位置信息用于填写收货地址"}}
}

参考文档:

  1. 地理位置接口新增与相关流程调整

  2. permission 字段说明

getLocation 使用 :

// 地理定位
async onLocation() {// 获取 纬度 、精度const { latitude, longitude } = await wx.getLocation()console.log(location)
}

chooseLocation 使用:

// 地理定位
async onLocation() {// 打开地图选择位置,获取 纬度 、精度const { latitude, longitude }  = await wx.chooseLocation()console.log(res)
}



2.拒绝授权后的解决方案  

在调用 wx.getLocation() 获取用地理位置时,如果用户选择拒绝授权,代码会直接抛出错误。

在拒绝授权以后,再次调用 wx.getLocation() 时,就不会在弹窗询问用户是否允许授权。

接下来,就需要优化授权的流程:

 代码如下:

方法里面的提示框,比如:wx.modal,wx.toast是自己在原生的基础上进一步封装的,自己用的时候可以用原生的即可,以自身项目业务为准,以下代码仅做参考:

// 获取用户地理位置信息
async onLocation() {// 调用 getSetting 方法获取用户所有的授权信息// 返回的 authSetting 包含小程序已向小程序申请过的权限已经授权结果(true、false)const { authSetting } = await wx.getSetting()console.log(authSetting)// scope.userLocation 是否已经授权获取地理位置的信息// 如果之前没有申请过返回 undefined,需要调用 getLocation// 如果之前同意了授权,返回 true,需要调用 getLocation// 如果之前拒绝了授权,返回 false,需要用户手动进行授权// 等于 true,或者不等于 undefined,说明需要进行授权// const isAuth =//   authSetting['scope.userLocation'] ||//   authSetting['scope.userLocation'] === undefined// 为了避免冗余的条件判断,使用 !! 把代码进行优化const isAuth = !!authSetting['scope.userLocation']if (!isAuth) {// 弹窗询问用户是否进行授权const modalRes = await wx.modal({title: '授权提示',content: '需要需要您的地理位置信息,请确认授权'})// 如果用户点击了取消,说明用户拒绝了授权,给用户提示if (!modalRes) return wx.toast({ title: '您拒绝了授权' })// 如果用户点击了确定,调用 wx.openSetting 打开微信客户端小程序授权页面// 并返回授权以后的结果const { authSetting } = await wx.openSetting()// 如果用户没有更新授权信息,提示没有更新授权if (!authSetting['scope.userLocation'])return wx.toast({ title: '授权失败!' })try {// 如果用户更新授权信息,则调用 getLocation 获取用户地理位置信息const locationRes = await wx.getLocation()// 打印地理位置信息console.log(locationRes)} catch (err) {console.log(err)}} else {try {// 如果是第一次调用 getLocation 或者之前授权过// 直接调用 getLocation 获取用户信息即可const locationRes = await wx.getLocation()console.log(locationRes)} catch (error) {wx.toast({ title: '您拒绝授权获取地址位置' })}}
}

3.开通腾讯位置服务

使用wx.chooseLocation()能够很方便的让用户来选择地理位置,但是wx.chooseLocation()返回的数据并没有包含省市区、省市区编码数据。

 这时候我们可以使用 腾讯位置服务 将返回的经度、纬度进行逆地址解析,转换成详细地址。

腾讯位置服务专为小程序开发提供了 JavaScript SDK,方便开发者在小程序中可以使用腾讯地图服务。

使用腾讯位置服务可以很方便的让开发者实现地址解析、逆地址解析等功能。

使用步骤:

  1. 申请开发者密钥(key):申请密钥

  2. 开通 webserviceAPI 服务:控制台 → 应用管理→我的应用 → 添加 key →勾选 WebServiceAPI →保存

  3. 下载微信小程序 JavaScriptSDK,微信小程序JavaScriptSDK v1.1 JavaScriptSDK v1.2

  4. 安全域名设置

    • 在小程序管理后台 -> 开发 -> 开发管理 -> 开发设置 -> “服务器域名” 中设置 request 合法域名

    • 添加 https://apis.map.qq.com


详细步骤:

1.申请密钥:密钥申请,微信扫码进行登录,选择绑定已有账号、或者注册新账号 (需要绑定手机、验证邮箱)

2. 开通webserviceAPI服务:控制台 ->应用管理 -> 我的应用 ->添加key-> 勾选WebServiceAPI -> 保存→ 创建完成

 3.下载微信小程序 JavaScriptSDK v1.2,下载将 .js 文件放到小程序的 libs 目录下  

4.安全域名设置,在小程序管理后台 -> 开发 -> 开发管理 -> 开发设置 -> “服务器域名” 中设置request合法域名,添加https://apis.map.qq.com,或者点击微信开发者工具中的暂时不校验域名


4.LBS 逆地址解析

LBS 逆地址解析是指通过地理坐标查找对应位置的详细地址信息。LBS 是 Location-Based Services 的缩写,翻译为中文就是基于地理位置的服务。

对于 LBS 逆地址解析,通常是输入地理坐标(经度和纬度),系统会返回地理位置的具体地址,如国家、省份、城市、街道、建筑等信息。

比如说,你有一个经纬度为(114.21892734521,29.575429778924)的坐标,通过 LBS 逆地址解析,你可以得到这个坐标对应的实际地址,可能是 "中国湖北省武汉市XXX区XXX路XXX号"。

使用步骤:

  1. 在项目中引入 SDK 核心类(上面已经下载的微信小程序JavaScriptSDK)

// var QQMapWX = require('../../libs/qqmap-wx-jssdk.js');
//这个地址看自己项目,一般是在工作目录的根目录下建libs文件夹,哪里需要在哪引入即可
import QQMapWX from '../../../../../libs/qqmap-wx-jssdk.min'
  1. onLoad 中实例化 API 核心类,同时配置创建的 key

// 引入SDK核心类,js文件根据自己业务,位置可自行放置
import QQMapWX from '../../../../../libs/qqmap-wx-jssdk.min'Page({onLoad: function () {// 实例化API核心类,把实例挂载到this上,方便其他方法中使用this.qqmapsdk = new QQMapWX({key: '申请的key'})}// coding...   
}
  1. 使用实例方法 reverseGeocoder 方法进行逆地址解析,将提供的坐标转换为详细的地址位置信息 

// LBS 地址逆解析
// 地理定位
async onLocation() {// 获取 纬度 、精度// const { latitude, longitude } = await wx.getLocation()// console.log(location)// 获取经、纬度、name用户搜索的地点名称let { latitude, longitude, name } = await wx.chooseLocation()// 使用 reverseGeocoder 方法进行逆地址解析this.qqmapsdk.reverseGeocoder({// 传入经、纬度location: {latitude,longitude},// 逆地址解析成功后执行success: (res) => {// 获取选择的const { street_number } = res.result.address_component// province 省  city 市  district 区const {province, // 省city, // 市district, // 区adcode, // 行政区划代码city_code, // 城市代码,由国家码+行政区划代码(提出城市级别)组合而来,总共为9位nation_code // 国家代码} = res.result.ad_infothis.setData({// 省级: 前两位有值,后4位置0,如,河北省: 130000provinceCode: adcode.replace(adcode.substring(2, 6), '0000'),provinceName: province,// 市前面多个国家代码,需要进行截取cityCode: city_code.slice(nation_code.length),cityName: city,// 东莞市、中山市、修州市、嘉关市 因其下无区县级,districtCode: district && adcode,districtName: district,// 详细地址address: name,fullAddress: [province, city, district, address].join('')})}})
}

注意事项:

逆地址解析解析初始用的时候发现解析不成功,需要配置接口的调用额度:

官方文档-基础示例:Hello World

官方文档-逆地址解析:reverseGeocoder

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/337692.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【儿童节特辑】用AI创造音乐,变身小小音乐家!

在儿童节这个充满欢笑的日子里,让我们一起探索如何用AI技术为孩子们准备一份特别的礼物——一张由AI生成的音乐专辑。🎵✨ 🎼 文字变旋律:开启音乐创作之旅 想象一下,只需一段文字,就能编织出一曲悠扬悦耳…

年中汇报季?——一文教会你如何进行数据分析

一、常见的数据分析报告类型 数据分析报告通常可以分为三类:日常分析报告、专题型分析报告和综合性分析报告。前两者是以数据结论建议的格式去撰写,综合性分析报告则是:行业环境调研(竞品类产品数据分析)自身产品数据…

【计算机软考_初级篇】每日十题2

各位老师大家好,软考对于日常的知识储备和企业中的考试,或者说在校大学生来说,那用处是非常大的!!那么下面我们进入正题,软考呢是分两种语言,java和C,对于其他语言目前还没&#xff…

轻松记录收支明细,智能筛选并统计买菜历史记录:一键掌握家庭财务

在繁忙的生活中,你是否曾为家庭财务的琐碎而烦恼?买菜、购物、日常开销……每一笔支出都似乎难以捉摸,让你在月底对账时头疼不已。现在,我们为你带来了一款全新的财务记录工具,让你轻松记录收支明细,智能筛…

【验证码识别】Yolov8入门到实战点选验证码数据集分类训练,孪生训练,导出onnx,搭建部署接口

【验证码识别】Yolov8入门到实战点选验证码数据集分类训练,孪生训练,导出onnx,搭建部署接口 文章目录 【验证码识别】Yolov8入门到实战点选验证码数据集分类训练,孪生训练,导出onnx,搭建部署接口声明一、标…

Python使用动态代理的多元应用

Python作为一种功能强大且易于学习的编程语言,在网络编程领域具有广泛的应用。当Python与动态代理技术结合时,便开启了一扇通往更多可能性的大门。以下将深入探讨Python使用动态代理可以实现的多种应用。 首先,Python结合动态代理在网络爬虫…

【活动】GPT-4O:AI语言生成技术的新里程碑

🌈个人主页: 鑫宝Code 🔥热门专栏: 闲话杂谈| 炫酷HTML | JavaScript基础 ​💫个人格言: "如无必要,勿增实体" 文章目录 GPT-4O:AI语言生成技术的新里程碑引言GPT系列简史回顾GPT-1: 初露锋…

创刊即王炸?首个IF近7分,稳坐中科院1区!同领域全球第一!

【欧亚科睿学术】 01 期刊基本概况 【期刊类型】经济类SSCI 【出版社】SPRINGER出版社 【期刊概况】IF:8.0-9.0,JCR1区,中科院1区 【版面类型】正刊,仅少量版面 【预警情况】2020-2024年无预警记录 【收录年份】2016年被WO…

I.MX6ULL主频和时钟配置实验

系列文章目录 I.MX6ULL主频和时钟配置实验 I.MX6ULL主频和时钟配置实验 系列文章目录一、前言二、I.MX6U 时钟系统详解三、硬件原理四、 7 路 PLL 时钟源五、时钟树简介六、内核时钟设置七、PFD 时钟设置八、AHB、IPG 和 PERCLK 根时钟设置九、实验程序编写十、编译下载10.1编写…

华为telnet的两种认证方式

华为telnet的两种认证方式 实验拓扑: 实验要求: 1.采用普通密码认证实现telnet 远程登录机房设备R3 2.采用AAA认证服务方式实现telnet 远程登录机房设备R3 实验步骤: 1.完成基本配置(设备接口配置IP,此步骤略过&#…

戴尔向“数”而行,以“质”致远,做新质生产力的躬耕者

【全球存储观察 | 热点关注】 自1984年戴尔成立,一路走来,戴尔科技集团40年长期持续的技术创新,一直引领全球科技行业的技术趋势。 到如今,AIGC风行一时,在重塑千行百业的同时,也加速了科技行业…

Python自然语言处理(NLP)库之NLTK使用详解

概要 自然语言处理(NLP)是人工智能和计算机科学中的一个重要领域,涉及对人类语言的计算机理解和处理。Python的自然语言工具包(NLTK,Natural Language Toolkit)是一个功能强大的NLP库,提供了丰富的工具和数据集,帮助开发者进行各种NLP任务,如分词、词性标注、命名实体…

搭载昇腾310NPU的Orange Pi AIpro开箱体验以及深度学习样例测试

Orange Pi AIpro开箱体验以及样例测试 随着人工智能和物联网技术的快速发展,单板计算机(Single Board Computer, SBC)在创客和开发者社区中越来越受到欢迎。我最近入手了一款高性能的单板计算机——Orange Pi AIpro。 在入手此款AI开发板之…

C/C++中互斥量(锁)的实现原理探究

互斥量的实现原理探究 文章目录 互斥量的实现原理探究互斥量的概念何为原子性操作原理探究 互斥量的概念 ​ 互斥量(mutex)是一种同步原语,用于保护多个线程同时访问共享数据。互斥量提供独占的、非递归的所有权语义:一个线程从成…

动态路由协议实验——RIP

动态路由协议实验——RIP 什么是RIP ​ RIP(Routing Information Protocol,路由信息协议)是一种内部网关协议(IGP),是一种动态路由选择协议,用于自治系统(AS)内的路由信息的传递。RIP协议基于…

计算机组成原理·定点加减法与先行进位

重点理解一下加减法的电路实现,先行进位的原理,以及时间延迟分析。挑重点记录一下我的理解。 定点加减法的运算 运算原理 在计算机内,定点数都是以补码的形式进行运算的。两个数 x , y x,y x,y 的加减法满足下面的规则: { [ x …

深入理解 Go 语言中的字符串不可变性与底层实现

文章目录 前言1 字符串类型的数据结构组成2 为什么要这么设计数据结构?3 为什么说字符串类型不可修改?4 如何实现字符串的修改?5 为什么字符串修改的字面量用单引号?6 如何判断字符串的修改新建了一个字符串?7 字符串的…

【机器学习】智能选择的艺术:决策树在机器学习中的深度剖析

在机器学习的分类和回归问题中,决策树是一种广泛使用的算法。决策树模型因其直观性、易于理解和实现,以及处理分类和数值特征的能力而备受欢迎。本文将解释决策树算法的概念、原理、应用、优化方法以及未来的发展方向。 🚀时空传送门 &#x…

PieCloudDB Database Flink Connector:让数据流动起来

面对客户环境中长期运行的各种类型的传统数据库,如何优雅地设计数据迁移的方案,既能灵活地应对各种数据导入场景和多源异构数据库,又能满足客户对数据导入结果的准确性、一致性、实时性的要求,让客户平滑地迁移到 PieCloudDB 数据…

Linux|虚拟机|Windows 11 家庭版的Hyper虚拟机服务开启

前言: Windows11的版本是比较多的,但有的时候笔记本预装的可能是家庭版,而家庭版的Windows通常是不支持虚拟机的,也就是说Hyper服务根本就看不到 Windows的程序和功能大体如下: 🆗,那么如何开…