一、使用高德天气接口：
网址链接为：
/api/webservice/guide/api/weatherinfo
（一）注册并获取Key
使用时候需要注册获取Key，因为是阿里旗下公司，可以使用支付宝扫码注册。注册后在图中所示的页面中点击 申请Key：
在打开的页面中点击右上角的“创建新应用”，填写应用名称和类型，我这里随便把应用名称定为Weather，创建好之后点击“添加”
可以给Key添加名字，服务平台注意要选择Web服务，这个选项才能使用天气查询API（这里不需要再点击它了）
提交之后就可以找到申请的Key了，这时候就可以去使用API了。
（二）调用API接口
页面中介绍了接口地址和请求方式，以及请求参数，应该比较好理解。
注意，使用微信开发者工具进行开发时，需要将网址添加到request的合法域名中，如果只是调试而不发布，可以在开发者工具本地设置中勾选不校验合法域名、web-view（业务域名）、TLS版本以及HTTPS证书，不过这样的设置是没法发布的，最后发布还是需要将网址添加到request的合法域名中。
根据请求参数，我们需要添加Key和city城市编码，我们可以先测试下：
新建项目后，在index.js（或者新建一个页面）中加入以下代码：
//index.js//获取应用实例const app = getApp()Page({data: {},onLoad:function(){var self = this;wx.request({url: '/v3/weather/weatherInfo',data:{'key': '***************************',//填入自己申请到的Key'city': '12',},header:{'content-type': 'application/json'},success:function(res){console.log(res.data);}})}})
上面代码会在页面加载好后向网络请求数据，在console中可以看到返回的信息：
其中返回的数据在api介绍页面中都有介绍，默认返回的是实况天气，也可以在请求中将extensions选项设置为all，就可以得到当天以及以后三天的天气信息，如图：
在项目里面使用具体如图所示：
实现过程：
先获取地理位置授权，根据当前位置的城市编码，获取当前城市的天气
代码如下：
<view class="head"><view class="dw" ><!-- <image src="../../images/map.png" class="icon-map"></image> --><text>{{city}}</text><image src="../../images/indexdown.png" class="icon-arrow"></image></view><view class="weather"><image src="../../images/weather1.png" wx:if="{{weather=='晴'}}"></image><image src="../../images/weather2.png" wx:if="{{weather=='阴'}}"></image><image src="../../images/weather3.png" wx:if="{{weather=='雨'}}"></image><text>{{temperature}}°C空气优</text></view><view class="search" bindtap="search"><input type="text" placeholder="搜索你所需的商品" value="" /><image src="../../images/search.png" class="icon-search"></image></view></view>
/* 顶部 */.head{display: flex;align-items: center;/* justify-content: space-between; */margin: 30rpx 30rpx 0;}.head .dw{max-width: 133rpx;font-size: 26rpx;height: 68rpx;line-height: 68rpx;}.head .icon-map{width: 29rpx;height: 39rpx;vertical-align: middle;margin-right: 10rpx;}.head .icon-arrow{width: 14rpx;height: 8rpx;margin-left: 10rpx;vertical-align: middle;}.head .icon-search{position: absolute;left: 35rpx;top: 24rpx;width: 24rpx;height: 24rpx;}.head .weather{display: flex;align-items: center;font-size: 24rpx;color: #999999;margin: 0 15rpx;}.head .weather image{width: 28rpx;height: 28rpx;margin-right: 8rpx;}.head .search{position: relative;margin-left: auto;}.head .search input{width: 360rpx;height: 68rpx;line-height: 68rpx;background: #F5F5F5;border-radius: 50rpx;font-size: 24rpx;color: #999;padding-left: 69rpx;box-sizing: border-box;}
// index.js// 获取应用实例const app = getApp()var QQMapWX = require('../../utils/qqmap.js');var qqmapsdk;Page({data: {city:'',adcode:'',weather:'',temperature:''},onLoad() {if(wx.getStorageSync('adcode')){this.setData({adcode: wx.getStorageSync('adcode')})this.getWeather();},getWeather() {var that = this;wx.request({url: '/v3/weather/weatherInfo',data:{'key': '***************************',//填入自己申请到的Key'city': that.data.adcode,},header:{'content-type': 'application/json'},success:function(res){that.setData({weather: res.data.lives[0].weather,temperature: res.data.lives[0].temperature})console.log(res.data);}})},onHide: function(){},onShow(){this.getWeizhi(); },//获取定位getWeizhi() {var that = this;qqmapsdk = new QQMapWX({key: '************************'});if(!wx.getStorageSync('city')){ //判断缓存里面有没有城市，没有wx.getSetting({ //先查看授权情况success:function(res){// var statu = res.authSetting;if(res.authSetting['scope.userLocation'] != undefined && res.authSetting['scope.userLocation'] != true){wx.showModal({title: '请求授权当前位置',content: '需要获取您的地理位置，请确认授权',success: function (res) {if (res.cancel) {wx.showToast({title: '拒绝授权',icon: 'none',duration: 1000})} else if (res.confirm) {wx.openSetting({success: function (dataAu) {if (dataAu.authSetting["scope.userLocation"] == true) {wx.showToast({title: '授权成功',icon: 'success',duration: 1000})//再次授权，调用wx.getLocation的APIthat.getToLocation()} else {wx.showToast({title: '授权失败',icon: 'none',duration: 1000})}}})}}})}else{that.getToLocation()}}})}else{ //有that.setData({city:wx.getStorageSync('city')})}},// 微信获得经纬度getToLocation: function () {let _this = this;wx.getLocation({type: 'wgs84',success: function (res) {console.log(JSON.stringify(res))var latitude = res.latitudevar longitude = res.longitudevar speed = res.speedvar accuracy = res.accuracy;// _this.setData({// latitude: res.latitude,// longitude: res.longitude// })_this.getLocal(latitude, longitude)},fail: function (res) {console.log('fail' + JSON.stringify(res))}})},// 获取当前地理位置getLocal: function (latitude, longitude) {let vm = this;qqmapsdk.reverseGeocoder({location: {latitude: latitude,longitude: longitude},success: function (res) {console.log(res.result);let city = res.result.ad_info.city;let adcode = res.result.ad_info.adcode;console.log(adcode)wx.setStorageSync('city', res.result.ad_info.city);wx.setStorageSync('adcode', res.result.ad_info.adcode);vm.setData({city: city,adcode: adcode})vm.getWeather()},fail: function (res) {console.log(res);},complete: function (res) {// console.log(res);}});},search() {wx.navigateTo({url: '/pages/search/search',})},onReady(){},})
本文部分引用了無負今日的文章，感谢你的文章。
到此结束！
如果觉得《小程序--------调用高德地图天气api获取天气》对你有帮助，请点赞、收藏，并留下你的观点哦！
