uni-app怎么接入高德地图 uni-app地图打卡功能实现【实战】

夜杰吖_7143

夜杰吖_7143

2026-03-27

1073人浏览

原创

uni.getLocation 默认返回 WGS84 坐标,而高德地图强制要求 GCJ02 坐标系,偏差可达 500 米;必须显式传 type: 'gcj02'(HBuilderX ≥ 3.9.12),H5 端须用 AMap.Geolocation 插件。

uni-app怎么接入高德地图 uni-app地图打卡功能实现【实战】

uni.getLocation 为什么总拿不到高德要求的 GCJ02 坐标?

因为 uni.getLocation 默认返回的是 WGS84,而高德地图所有坐标系(包括地图渲染、距离计算、地理围栏)都基于国测局加密的 GCJ02。直接拿 WGS84 去算距离、画标记,偏差可能高达 500 米——打卡点明明在公司楼下,系统却提示“距打卡点 327 米”,用户当场怀疑人生。

实操建议:

  • uni.getLocation 必须显式传 type: 'gcj02',iOS 和 Android 均支持,但部分旧版 HBuilderX 可能忽略该参数,务必确认 CLI 版本 ≥ 3.9.12
  • 不要依赖 uni.getSystemInfo 判断平台再动态改 type,高德 SDK 内部对两种坐标系处理逻辑不同,混用会导致 AMap.Geolocation 插件定位失败或回调不触发
  • H5 端无法使用 type: 'gcj02'(浏览器 API 不提供),必须走高德 JS API 的 AMap.Geolocation 插件,否则坐标系错位

manifest.json 里 maps 模块配了,为啥 Android 定位还是失败?

常见错误是只填了 Key,却漏掉了 Android 签名校验——高德会校验 APK 签名 SHA1 + 包名组合,哪怕开发时用调试包运行,也必须把 debug.keystore 的 SHA1 配进去,否则定位直接返回 fail permission denied 或静默失败。

实操建议:

  • 用命令获取调试签名 SHA1:keytool -list -v -keystore ~/.android/debug.keystore -alias androiddebugkey -storepass android -keypass android
  • 在高德控制台添加 Key 时,“打包签名”字段填完整 SHA1(含冒号,如 A1:B2:C3:...),不是 MD5,也不是 base64 编码结果
  • Android 平台 Key 必须和 manifest.json 中 packagename 完全一致(区分大小写),例如 com.myapp.dev 和 com.myapp.Dev 是两个不同应用

打卡距离判断不准,是不是要用 haversine 公式手动算?

不用。高德原生提供 AMap.GeometryUtil.distance,它内部已适配 GCJ02 坐标系下的球面距离计算,精度远高于通用 haversine(后者默认按 WGS84 计算,输入 GCJ02 坐标会引入额外误差)。

实操建议:

  • 别自己写距离函数,直接调:AMap.GeometryUtil.distance([lng1, lat1], [lng2, lat2]),单位是米
  • 打卡半径建议设为 100–200 米:太小(如 10 米)受 GPS 漂移影响大;太大(如 500 米)失去打卡意义,且 iOS 后台定位精度骤降,容易误判
  • 首次定位后别立刻判断距离——uni.getLocation 返回的可能是粗略位置(accuracy > 50m),应等 AMap.Geolocation 插件的 complete 回调后再取 result.position,它带 accuracy 字段,可过滤掉低置信度结果

后台息屏后定位中断,插件选 Ba-LocationAMap 还是 @jv-uni/amap?

选 Ba-LocationAMap。它底层调用高德 Android/iOS 原生 SDK 的持续定位服务(startLocation + 前台服务/Background Modes),而 @jv-uni/amap 本质仍是 JS 层封装,退到后台后会被系统强制冻结,iOS 上几乎必然中断,Android 也仅在部分厂商白名单机型可用。

实操建议:

  • Ba-LocationAMap 需单独申请高德「Android 后台定位」权限,在控制台 Key 配置页勾选「后台定位」服务,否则即使插件装了也报错 location service not available
  • iOS 端必须在 manifest.json 中开启 usesBackgroundModes,并配置 location 和 audio(后者用于保活,非真要播音频)
  • 插件启动后,定位回调频率由原生层控制,JS 层无法靠 setInterval 模拟——试图用定时器反复调 uni.getLocation 只会加速被系统杀进程

最易被忽略的一点:高德 Key 的服务平台类型必须和实际使用场景严格匹配。Web 页面用 Web 端 Key,App 用 AppKey,小程序用小程序 Key——混用不仅定位失败,还可能触发风控限频,连带影响同账号下其他应用。

高德地图
高德地图

高德地图是国内专业的手机地图,超过3.2亿用户在使用!高德地图数据准确率高、省流量、躲避拥堵功能强大,平均每天为用户省油61万升,有需要的小伙伴快来保存下载体验吧!

下载

相关标签:

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

相关专题

更多
python是前端还是后端
python是前端还是后端

Python属于前端也属于后端,其灵活性和丰富的生态系统使得开发人员能够在不同的领域中灵活运用。本专题为大家提供python相关的文章、下载、课程内容,供大家免费下载体验。

2023.08.11

2783

5

前端如何实现即时通讯
前端如何实现即时通讯

实现即时通讯的方法有WebSocket、Long Polling、Server-Sent Events、WebRTC等等。详细介绍:1、WebSocket,它可以在客户端和服务器之间建立持久连接,实现实时的双向通信,前端可以使用 WebSocket API来创建WebSocket连接,并通过发送和接收消息来实现即时通讯;2、Long Polling,是一种模拟实时通信的技术等等。

2023.10.09

6063

6

前端和后端的区别
前端和后端的区别

前端关注的是用户界面的设计和交互,而后端则注重数据处理和逻辑控制。想了解更多前端后端的相关内容,可以阅读本专题下面的文章。

2024.03.19

6990

13

php和前端的关联介绍
php和前端的关联介绍

php既可以作为前端语言,也可以作为后端语言。想了解更多php和前端的相关内容,可以阅读本专题下面的文章。

2024.03.22

6778

10

前端外包工作内容有哪些
前端外包工作内容有哪些

前端外包工作内容包括:1. 网站和应用程序开发;2. 用户界面和交互设计;3. 用户体验优化;4. 设计和视觉开发;5. 跨浏览器兼容性;6. 性能优化;7. 维护和更新;8. 项目管理和沟通。想了解更多前端的相关内容,可以阅读本专题下面的文章。

2024.05.22

963

5

Uvicorn 报错与问题解决教程
Uvicorn 报错与问题解决教程

本专题汇总了Uvicorn服务器常见问题与报错解决的教程合集,涵盖启动失败、端口占用、模块导入错误、事件循环冲突及热重载失效等典型故障的排查思路。同时整理了多进程与Worker配置、SSL/HTTPS证书报错、跨域与代理配置等实战解决方案,助你快速定位并解决Uvicorn运行中的各类问题。

2026.11.02

0

14

Uvicorn使用教程
Uvicorn使用教程

本专题汇总了Uvicorn使用教程与启动运行指南,涵盖其作为Python ASGI服务器的定位与特点,以及命令行启动(uvicorn main:app --reload)、参数配置(host/port/workers)、程序内嵌运行与Gunicorn结合部署等核心用法。同时整理了热重载调试、日志配置与生产环境部署优化等技巧,助你快速掌握Uvicorn的运行与配置。

2026.11.02

0

17

Uvicorn安装配置教程
Uvicorn安装配置教程

本专题汇总了Uvicorn的安装配置教程与部署指南,涵盖通过pip安装Uvicorn、启动FastAPI/Starlette应用、开发模式热重载(--reload)及多进程工作模式配置等核心操作。同时整理了结合Gunicorn的生产部署方案、HTTPS与反向代理配置及性能调优技巧,助你快速完成Uvicorn服务的安装与上线部署。

2026.11.02

0

17

Vite 项目如何打包和部署
Vite 项目如何打包和部署

Vite项目打包部署专题汇集生产构建、产物预览、输出目录、资源路径、Nginx与GitHub Pages部署及常见白屏和路由404问题的已审核文章,帮助读者完成上线流程。

2026.10.28

100

16

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
热门推荐
/
最新课程
phpStudy极速入门视频教程
phpStudy极速入门视频教程

共6课时 | 54.7万人学习

独孤九贱(4)_PHP视频教程
独孤九贱(4)_PHP视频教程

共89课时 | 134.1万人学习