uniapp之安卓使用高德地图

本文详细介绍了如何在uni-app中集成高德地图SDK,包括在高德开放平台创建应用、获取SHA1和PackageName,以及通过JRE获取安全码SHA1的步骤,同时提供了HBuilderX云端打包的相关信息。
摘要由CSDN通过智能技术生成

最近在做地图定位相关的东西,然后天真的我以为uni和原生微信应该是差不多操作的,但是!!!现实给我了一巴掌,并告诉我你丫的白日做梦呢吧。
之后度娘了一波,大部分都是直接把uni官方那一套粘贴过来,最后的最后终于通过七零八碎的文章搞定了。
首先,你要先登陆高德开放平台https://lbs.amap.com/,然后到控制台的应用管理---->我的应用里面创建一个应用在这里插入图片描述
然后点击添加(主要说安卓)

在这里插入图片描述
这个时候呢,就会出现问题了,安全码SHA1和调试码SHA1以及PackageName这些要从哪里来勒?

首先说简单的两个:调试码SHA1、PackageName

HBuilderX云端打包选择“公共测试证书”时,SHA1值为:BB:AC:E2:2F:97:3B:18:02:E7:D6:69:A3:7A:28:EF:D2:3F:A3:68:E7,详情参考:https://ask.dcloud.net.cn/article/36522
HBuilderX云端打包选择“老版本DCloud公用证书”时,SHA1值为:BA:AD:09:3A:82:82:9F:B4:32:A7:B2:8C:B4:CC:F0:E9:F3:7D:AE:58,详情参考:https://ask.dcloud.net.cn/article/68
注意!如果你填的是公共测试证书,那云打包的安卓证书就要选择为公共证书
在这里插入图片描述
然后是PackageName其实就是你的安卓包名(切记这两个要一致才行

然后是里面最烦人的就是安全码SHA1了
首先要想获取到它呢,你要去安装一个东东(下载这个东西你要先注册,注册的时候密码不要太复杂,因为之后会用到),官方下载jre安装包:https://www.oracle.com/technetwork/java/javase/downloads/index.html
我下载的是JRE8的Windows x64(https://www.oracle.com/java/technologies/javase-jre8-downloads.html)
下载完了呢,我直接就安装在c盘了,因为之后要去添加环境变量
然后再说把jre添加到环境变量这里来,他们都说直接右键我的电脑然后选择点击属性,关键是我特么点击属性不是打开的,好吧,然后我就在搜索栏搜索系统变量在这里插入图片描述
然后点击到下个页面,如下图,再点击环境变量进入

在这里插入图片描述
点击里面的parh之后再点击编辑
在这里插入图片描述
然后进入到编辑界面,点击新建,再点击浏览,如果你的jre页面安装在c盘的,那地址应该和我差不多

在这里插入图片描述
环境变量配置好了之后呢,就打开你滴黑窗口,输入d:(切换到d路径)
官方说的用keytool -genkey -alias testalias -keyalg RSA -keysize 2048 -validity 36500 -keystore test.keystore但是会提示让你用最新的

最新的:keytool -importkeystore -srckeystore test.keystore -destkeystore test.keystore -deststoretype pkcs12

test.keystore是证书文件名称,可修改为自己想设置的文件名称,也可以指定完整文件路径
然后就会开始问问题了。

输入密钥库口令: 就是你登录jre是的登陆密码
再次输入新口令: 同上
您的名字与姓氏是什么?
您的组织单位名称是什么?
您的组织名称是什么?
您所在的城市或区域名称是什么?
您所在的省/市/自治区名称是什么?
该单位的双字母国家/地区代码是什么?
中国为CN,然后回车
CN=test, OU=test, O=test, L=test, ST=test, C=test是否正确?
[no]: //确认上面输入的内容是否正确,输入y,回车
输入 的密钥口令
(如果和密钥库口令相同, 按回车):
再次输入新口令:

然后在输入keytool -list -v -keystore test.keystore(证书名)就得到了这些东西

别名: test
创建日期: 2019-12-1
条目类型: PrivateKeyEntry
证书链长度: 1
证书[1]:
所有者: CN=test, OU=test, O=test, L=test, ST=test, C=test
发布者: CN=test, OU=test, O=test, L=test, ST=test, C=test
序列号: 51ca7b50
有效期为 Sun Dec 01 10:09:11 CST 2019 至 Tue Nov 07 10:09:11 CST 2119
证书指纹:
MD5: 86:87:9E:8D:F3:E5:1D:92:02:4A:B1:60:1C:59:4D:1C
SHA1: E0:FB:FB:1F:00:14:AC:7F:EE:24:7E:8A:3F:26:D4:8A:EA:7C:AC:7E(就是这个了安全证书)

 SHA256: 86:D0:DD:D5:94:76:4E:50:94:8B:3D:9C:5F:C2:B7:05:B5:F4:D9:4F:5B:C3:54:9C:04:50:06:10:27:23:97:00

签名算法名称: SHA256withRSA

主体公共密钥算法: 2048 位 RSA 密钥

然后再把key添加到HBuilderX里面的manifest.json里面的app模块配置勾选map----->高德地图然后把你的appkey填进去就完成啦

  • 0
    点赞
  • 11
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
Uniapp 是一款跨平台的开发框架,可以同时支持多个平台,包括 iOS、Android、H5 等。而 renderjs 是一款基于 Vue.js 的可视化开发工具,可以在 Uniapp 中快速实现高德地图的集成。 以下是在 Uniapp使用 renderjs 实现高德地图的步骤: 1. 首先在项目中安装 renderjs: ``` npm install renderjs -D ``` 2. 在需要使用高德地图的页面中引入 renderjs: ```javascript import Renderjs from 'renderjs' ``` 3. 在页面的 data 中定义地图相关的变量: ```javascript data() { return { map: null, // 地图对象 markers: [], // 地图标记点 center: [116.397428, 39.90923], // 地图中心点坐标 zoom: 11 // 地图缩放级别 } } ``` 4. 在页面的 mounted 生命周期中初始化地图: ```javascript mounted() { // 初始化地图 this.map = Renderjs.initMap('map-container', { center: this.center, zoom: this.zoom }) } ``` 5. 在需要添加标记点的地方,用 addMarker 方法: ```javascript // 添加标记点 this.markers.push({ position: [116.397428, 39.90923], content: '这是一个标记点' }) this.addMarker() ``` 6. 实现 addMarker 方法: ```javascript addMarker() { this.markers.forEach(marker => { Renderjs.addMarker(this.map, { position: marker.position, content: marker.content }) }) } ``` 7. 在页面中添加地图容器,并设置 id 为 map-container: ```html <template> <view> <view id="map-container"></view> </view> </template> ``` 通过以上步骤,就可以在 Uniapp 中快速实现高德地图的集成。
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值