uni-app-微信小程序-用高德sdk获取地理位置,以及天气信息
目录
uni-app 微信小程序 用高德sdk获取地理位置，以及天气信息
uni-app 微信小程序采用高德sdk获取地理位置和天气信息主要有以下几个步骤：
1. 注册高德开发者，并获取应用key
在这个网页最下面，按步骤来就可以了。注意创建完应用后，点击添加按钮，选择小程序sdk 生成key。最后生成的key如下所示：
2. 下载高德小程序sdk，并放在uni-app项目中
3. 使用高德小程序sdk 获取地理位置接口，天气信息接口
import amap from "@/libs/gaode/amap-wx.130.js";
created() {
this.amapPlugin = new amap.AMapWX({
key: "fc60464e53ac5bfc1f933d9b5e0a0a3b",
});
this.getLocation();
},
methods: {
async getLocation() {
const res = await checkAuthorize("userLocation");
if (res.success) {
this.getRegeo();
}
},
getRegeo() {
const that = this;
uni.showLoading({
title: "获取信息中",
});
this.amapPlugin.getRegeo({
success(data) {
that.loc = data[0].name;
uni.hideLoading();
},
fail(err){ //不加此字段控制台会报错
console.log('fail')
}
});
this.amapPlugin.getWeather({
success(res){
console.log('liubbc weather: ', res)
that.imgList[4].name = res.humidity.data
that.temperature = res.temperature.data
that.weather = res.weather.data
that.imgList[1].name = res.windpower.data
that.time = res.liveData.reporttime
},
fail(err){
console.log('fail')
}
})
},
},注意在接口传递参数中要加上fail 字段，否则控制台会报错。
4. 添加服务器域名（https://restapi.amap.com）
你可能在开发微信开发者工具中，以及真机调试中都能获取地理位置和天气信息，但发布到体验版，或发布到线上，一直loading 获取不到天气信息，这是因为没有把高德小程序sdk接口用到的URL地址添加到小程序服务器域名中。