uni-app如何配置高德地图SDK的API密钥

风强姑娘_1029

风强姑娘_1029

2026-08-21

942人浏览

原创

必须分平台配置高德key:android校验packagename+sha1,ios校验bundleidentifier;h5需web sdk key并配置securityjscode;逆地理编码须用web服务key;uni.getlocation需指定type:'gcj02'(app-plus)或改用amap.geolocation(h5)。

uni-app如何配置高德地图sdk的api密钥

manifest.json 里必须分平台填 Android/iOS Key,不能共用一个字符串

Android 和 iOS 的高德 Key 是两套独立校验机制:Android 校验 packageName + SHA1,iOS 校验 bundleIdentifier。哪怕你把同一个字符串复制粘贴到两边,任一平台都会定位失败,uni.getLocation 返回 errCode: 10002 或静默无响应。

必须在 manifest.json"app-plus" 节点下显式分开配置:

"app-plus": {
  "distribute": {
    "android": {
      "maps": {"AMap": "your-android-key-here"},
      "packageName": "com.example.app"
    },
    "ios": {
      "maps": {"AMap": "your-ios-key-here"},
      "bundleIdentifier": "com.example.app"
    }
  }
}
  • Android Key 申请时,keytool -list -v -keystore your-release-key.keystore 得到的 SHA1 必须和高德控制台填写的一致;调试用的 debug.keystore 默认路径是 ~/.android/debug.keystore
  • iOS Key 申请时,bundleIdentifier 必须和 Xcode 工程中设置的完全一致(大小写敏感),且高德控制台要勾选「iOS 平台」
  • HBuilderX 云打包若用了自定义证书,务必用该证书重新生成 SHA1 填到高德控制台,否则真机调试通过、云打包后失效

H5 端要用 Web SDK Key,且必须配 securityJsCode

H5 不走原生 SDK,而是加载高德 JSAPI,所以 Key 类型完全不同:必须申请「Web 端(JS API)」类型密钥,并在 manifest.json"h5" 节点下配置,漏掉 securityJsCode 会导致地图白屏或定位失败。

高德地图 (Fangtian)
高德地图 (Fangtian)

高德地图 API 调用工具,返回原始 JSON 数据。Use when users ask about 天气、地址、坐标、周边、路线、导航、打车、行程 in China. Commands: weather, geo, regeo, search, around, detail, route, distance,...

下载
"h5": {
  "sdkConfigs": {
    "maps": {
      "amap": {
        "key": "your-web-key",
        "securityJsCode": "your-security-js-code",
        "serviceHost": "https://your-domain.com"
      }
    }
  }
}
  • securityJsCode 是高德新版 JSAPI 的强制安全字段,不填或填错会直接报 Invalid key
  • Web Key 的「安全设置」里必须添加当前 H5 域名(支持通配符,如 https://*.example.com),本地开发用 http://localhost:8080 也要手动加进去
  • 注意:H5 端不支持 type: 'gcj02'uni.getLocation 返回的是 WGS84 坐标,需用高德 JSAPI 的 AMap.Geolocation 实例重新获取 GCJ-02 坐标

逆地理编码要用 Web 服务 Key,不是地图展示 Key

调用 https://restapi.amap.com/v3/geocode/regeo 这类 HTTP 接口,必须用「Web 服务」类型密钥,和前面所有 Key 都不通用。常见错误是拿 Android Key 或 Web SDK Key 直接拼进 URL,结果返回 {"status":"0","info":"INVALID_USER_KEY","infocode":"10002"}

  • Web 服务 Key 申请时,「服务平台」选「Web 服务」,白名单 IP 可填 0.0.0.0/0(开发阶段)或具体服务器出口 IP
  • 接口参数中 location经度,纬度(注意顺序!不是纬度在前),且坐标系必须是 GCJ-02
  • 不要在前端直接暴露 Web 服务 Key——应由后端代理请求,或用高德「安全密钥」做签名(sig 参数),否则 Key 可被爬取

uni.getLocation 必须指定 type: 'gcj02' 才能和地图标记对齐

高德地图 SDK 内部使用国测局加密坐标系(GCJ-02),而 uni.getLocation 默认返回 WGS84(GPS 原始坐标)。如果你用 type: 'wgs84' 拿到的经纬度直接传给 <map></map> 组件,标记点会偏移 500 米以上——这不是精度问题,是坐标系错配。

正确写法:

uni.getLocation({
  type: 'gcj02',
  success(res) {
    console.log(res.latitude, res.longitude); // 这组值可直接喂给 <map> 的 latitude/longitude
  }
});</map>
  • type: 'gcj02' 仅在 app-plus 环境下有效,H5 端需改用高德 JSAPI 的 AMap.Geolocation
  • 运行时判断可用 uni.getSystemInfoSync().platform === 'app-plus',避免 H5 报错
  • 如果用 <map></map> 组件的 show-location 属性,它内部已自动处理 GCJ-02,但你自己传入的 markers 坐标仍需手动转
实际项目里最容易被忽略的,是 Web 服务 Key 和 Web SDK Key 的混用,以及 type: 'gcj02' 在多端条件下的兼容写法——这两处出错,地图要么不显示,要么标记全飘在海里。

大量免费API接口:立即使用
涵盖生活服务API、金融科技API、企业工商API、等相关的API接口服务。免费API接口可安全、合规地连接上下游,为数据API应用能力赋能!

相关文章

高德地图
高德地图

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

下载

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

相关专题

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

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

2023.08.11

2023

5

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

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

2023.10.09

4303

6

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

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

2024.03.19

5410

13

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

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

2024.03.22

4858

10

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

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

2024.05.22

683

5

http与https有哪些区别
http与https有哪些区别

http与https的区别:1、协议安全性;2、连接方式;3、证书管理;4、连接状态;5、端口号;6、资源消耗;7、兼容性。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

2024.08.16

5210

6

Aionclaw智能助手介绍
Aionclaw智能助手介绍

本专题汇总了AionClaw(AI龙虾助手)的功能介绍与在线使用入口。AionClaw是杭州趣猿人工智能有限公司推出的桌面级AI智能体,能直接在电脑上读写文件、运行脚本、操作浏览器,自动交付Word、PPT、Excel等成品。

2026.09.20

20

13

AionClaw AI智能体与电脑自动化任务执行功能使用教程
AionClaw AI智能体与电脑自动化任务执行功能使用教程

AionClaw专题整理AI智能体与电脑自动化相关功能使用教程,涵盖安装部署、AI任务执行、Skills技能、文件处理、浏览器控制、电脑操作、持久记忆、聊天工具连接以及办公、编程和内容创作等功能,帮助用户快速掌握AionClaw的实际使用方法。

2026.09.20

0

15

AI视频生成软件推荐
AI视频生成软件推荐

本专题汇总了当前主流的AI视频生成软件推荐与排行榜单,涵盖seko、AniShort、剧云、Lovart、LiblibAI及立刻mv等热门工具。同时整理了各软件在文生视频、图生视频、时长限制、画质表现及免费额度等方面的差异对比,助您快速选对适合创作需求的AI视频生成工具。

2026.09.16

180

9

热门下载

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

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
uni-app从入门到实战教程
uni-app从入门到实战教程

共0课时 | 0人学习

uni-app x harmony开发指南
uni-app x harmony开发指南

共0课时 | 0人学习

uni-app鸿蒙运行和发行
uni-app鸿蒙运行和发行

共0课时 | 0人学习