uniapp 申请高德地图key

1,381 阅读2分钟

持续创作,加速成长!这是我参与「掘金日新计划 · 10 月更文挑战」的第2天,点击查看活动详情

最近使用uniapp做移动端发现,uniapp自带的地图使用功能有限,很多功能需要使用第三方api才能实现,比如地址搜索、选择功能。故在网上搜索了很多教程,不尽如意,自己总结了一个,希望可以帮助到有需要的同志们。

申请注意事项

1.app权限确定打开;

2.app端打包包名必须与高德申请的key包名一致

3.app必须使用自有证书,只有使用自有证书才有权限访问高德地图定位

4.app端使用的地图,建议使用高德地图。

5.不配置第三方key,很多功能在打包之后无法使用,比如可以定位(uni.getLocation),但是无法选择地址(uni.chooseLocation

Image.png

1、 打开高德api网页

打开高德api接口官网,找到控制台->应用管理->我的应用 你会看到创建新应用,应用名称可以随便填写

Image.png

2、获取SHA1秘钥

具体查看教程ask.dcloud.net.cn/article/29

注意:SHA1信息记得保存(SHA1码,密码,名称),最好生成一个txt文件保存,之后需要用到,比如打包时,参考如图

Image.png

3、高德平台,配置安卓系统key

Image.png

Image.png

Image.png

4、高德平台,配置ios系统key

Image.png

Image.png

5、在hbuilder中配置key值

Image.png

6、app权限开启

具体参考ask.dcloud.net.cn/article/369…

在源码中添加以下代码

"<uses-permission android:name=\"android.permission.ACCESS_COARSE_LOCATION\" />",  

  "<uses-permission android:name=\"android.permission.ACCESS_FINE_LOCATION\" />",  

  "<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\" />",  

  "<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\" />",  

  "<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\" />",  

  "<uses-permission android:name=\"android.permission.INTERNET\" />",  

  "<uses-permission android:name=\"android.permission.READ_PHONE_STATE\" />",  

  "<uses-permission android:name=\"android.permission.WRITE_EXTERNAL_STORAGE\" />",  

  "<uses-permission android:name=\"android.permission.ACCESS_LOCATION_EXTRA_COMMANDS\" />",  

  "<uses-permission android:name=\"android.permission.BLUETOOTH\" />",  

  "<uses-permission android:name=\"android.permission.BLUETOOTH_ADMIN\" />"

7、打包

打【自定义基座】包,进行真机自测,进行【标准基座】测试无效,无法保证打包成apk时,地图可以正常使用。打开hbuilder->运行->运行至手机或模拟器->制作自定义调试基座

Image.png

注意开打包之后的控制台信息,教你怎么运行到手机的

8、运行到手机上,测试效果

使用uni.chooseLocation自测

uni.chooseLocation({
                success: function(res) {
                    console.log('位置名称:', res);
                    that.form.SamplingLocation = res.name;
                },
                fail: function(err) {
                    console.log('err', err);
                }
});

同理:申请百度SDK、谷歌SDK可参考配置