对接阿里云天气，获取天气预报数据

我最近在开发个人网站，为了丰富页面，就新增了一个天气预报的数据展示，写此博客记录一下。

获取天气数据调用的易源数据天气，需要经纬度的参数，因此这里调用了百度地图的api来获取经纬度。具体实现过程如下：

    <script type="text/javascript" src="http://api.map.baidu.com/api?v=3.0&ak=你自己的ak"></script>

//天气预报版块//百度api 通过ip定位var myCity = new BMap.LocalCity();myCity.get(myFun);var lat;//纬度var lng;//经度function myFun(result) {var cityName = result.name;$("#position").append(cityName);lat = result.center.lat;lng = result.center.lng;// alert("IP 定位城市:" + cityName+"   经度"+result.center.lng+"   纬度"+result.center.lat);$.ajax({type:"get",//这里的请求方式与前面所说的请求方式一样url:'https://ali-weather.showapi.com/gps-to-weather?from=5&lat='+lat+'&lng='+lng+'&need3HourForcast=0&needAlarm=0&needHourData=0&needIndex=0&needMoreDay=0',//url就是api请求接口beforeSend:function(request){    //向接口发送身份认证request.setRequestHeader("Authorization","APPCODE "+"你自己的appcode");//注意这里APPCODE后面有一个空格，不能删掉},dataType:"json",//请求返回数据格式success: function (data) {console.log(data);var city = data.showapi_res_body.cityInfo.c5;var temperature = data.showapi_res_body.now.temperature;var weather = data.showapi_res_body.now.weather;var weatherPic = data.showapi_res_body.now.weather_pic;var windPower = data.showapi_res_body.now.wind_power;document.getElementById("weather").setAttribute('title',weather)$("#weather").append('<img style="width: 30px;position:relative;top:7px" title = '+ weather +' src ='+ weatherPic +'> '+city+': '+temperature+'℃ 风力：'+windPower)},error:function(e){console.log(e.message);}})}

ajax中的请求的url为：https://ali-weather.showapi.com/gps-to-weather?from=5&lat=’+lat+’&lng=’+lng+’&need3HourForcast=0&needAlarm=0&needHourData=0&needIndex=0&needMoreDay=0’

其中部分参数说明：

这个接口正常返回数据结构为：

{"showapi_res_code": 0,"showapi_res_error": "","showapi_res_body": {"cityInfo": {//查询的地区基本资料"c6": "yunnan",//城市所在省英文名"c5": "丽江",//城市所在市中文名"c4": "lijiang",//城市所在市英文名"c3": "丽江",//城市中文名"c9": "中国",//城市所在国家中文名"c8": "china",//城市所在国家英文名"c7": "云南",//城市所在省中文名"c17": "+8","c16": "AZ9888",//雷达站号"c1": "101291401",//区域id"c2": "lijiang",//城市英文名"c11": "0888",//城市区号"longitude": 100.222,//经度"c10": "2",//城市级别"latitude": 26.903,//纬度"c12": "674100",//邮编"c15": "2394"//海拔},"now": {//现在实时的天气情况"aqi": "71",  //空气质量指数，越小越好"aqiDetail": { //aqi明细数据"aqi": "71",  "area": "北京","area_code": "beijing","co": "0.817", //一氧化碳1小时平均"no2": "52",  //二氧化氮1小时平均"o3": "33", //臭氧1小时平均"o3_8h": "9", //臭氧8小时平均"pm10": "56", //颗粒物（粒径小于等于10μm）1小时平均"pm2_5": "51", //颗粒物（粒径小于等于2.5μm）1小时平均"primary_pollutant": "颗粒物(PM2.5)","quality": "良", //空气质量指数类别，有“优、良、轻度污染、中度污染、重度污染、严重污染”6类"so2": "3" //二氧化硫1小时平均},"sd": "70%",  //空气湿度"temperature": "15", //当前气温"temperature_time": "18:30",  //采集时间"weather": "晴",  //天气文字标识"weather_pic": "http://appimg.showapi.com/images/weather/icon/day/00.png", //天气图片地址"wind_direction": "北风",  //风向名称"wind_power": "1级"  //风力},"f1": {//今天的天气预报 ,f2是明天，f3是后天，直到f7"air_press": "1008 hPa",  //大气压"day": "20151023",   //日期"day_air_temperature": "18",  //白天天气温度(摄氏度)"day_weather": "晴", //白天天气标识"day_weather_pic": "http://app1.showapi.com/weather/icon/day/00.png", //白天天气图标"day_wind_direction": "无持续风向", //白天风向 "day_wind_power": "微风<10m/h", //白天风力"jiangshui": "3%",  //降水概率"night_air_temperature": "9",  //晚上气温(摄氏度)"night_weather": "晴",//晚上天气标识"night_weather_pic": "http://app1.showapi.com/weather/icon/night/00.png", //晚上天气图标"night_wind_direction": "无持续风向", //晚上风向"night_wind_power": "微风<10m/h", //晚上风力 "sun_begin_end": "06:35|17:23",  //日出|日落时间"weekday": 5,                  //星期几"ziwaixian": "中等",         //紫外线强度"index": {"yh": {//约会指数"title": "较不适宜","desc": "建议尽量不要去室外约会。"},"ls": {//晾晒指数"title": "不宜","desc": "降水可能会淋湿衣物，请选择在室内晾晒。"},"clothes": {//穿衣指数"title": "较舒适","desc": "建议穿薄外套或牛仔裤等服装。"},"dy": {//钓鱼指数"title": "不宜","desc": "天气不好，不适宜垂钓。"},"beauty": {//化妆指数"title": "保湿","desc": "请选用中性保湿型霜类化妆品。"},"xq": {//心情指数"title": "较差","desc": "雨水可能会使心绪无端地挂上轻愁。"},"travel": {//旅游"title": "适宜","desc": "较弱降水和微风将伴您共赴旅程。"},"hc": {//划船指数"title": "不适宜","desc": "天气不好，建议选择别的娱乐方式。"},"zs": {//中暑指数"title": "无","desc": "气温不高，中暑几率极低。"},"cold": {//感冒"title": "较易发","desc": "降温幅度较大，预防感冒。"},"gj": {//逛街指数"title": "较适宜","desc": "有降水，逛街需要带雨具。"},"uv": {//紫外线"title": "最弱","desc": "辐射弱，涂擦SPF8-12防晒护肤品。"},"cl": {//晨练指数"title": "较不宜","desc": "室外锻炼请携带雨具。"},"glass": {//太阳镜"title": "不需要","desc": "白天能见度差不需要佩戴太阳镜"},"wash_car": {//洗车"title": "不宜","desc": "有雨，雨水和泥水会弄脏爱车。"},"aqi": {//空气质量指数，越小越好"title": "中","desc": "无需特别防护"},"ac": {//空调控制"title": "较少开启","desc": "体感舒适，不需要开启空调。"},"mf": {//美发指数"title": "一般","desc": "建议选用防晒滋润型护发品或带遮阳帽。"},"ag": {//过敏指数"title": "极不易发","desc": "无需担心过敏，可放心外出，享受生活。"},"pj": {//啤酒指数"title": "较适宜","desc": "适量的饮用啤酒，注意不要过量。"},"nl": {//夜生活指数"title": "较不适宜","desc": "建议夜生活最好在室内进行。"},"pk": {//放风筝指数"title": "不宜","desc": "天气不好，不适宜放风筝。"}},"alarmList": [{"city": "大连",  //预警城市"issueContent": "大风蓝色预警:预计23日23时到24日08时:大连、锦州、营口、盘锦、葫芦岛地区陆地偏北风6级,阵风7级;渤海、渤海海峡、黄海北部偏北风7级,阵风8级。大连、丹东、锦州、营口、盘锦、葫芦岛附近海域和航线将受影响,请注意防范。省气象灾害预警中心10月23日16时35分发布","issueTime": "2015-10-23 16:40:00","province": "辽宁省","signalLevel": "蓝色","signalType": "大风"}],"3hourForcast": [{"hour": "20时-23时 ","temperature": "12℃/10℃","weather": "晴","weather_pic": "http://app1.showapi.com/weather/icon/night/00.png","wind_direction": "无持续风向","wind_power": "微风"},{"hour": "23时-02时 ","temperature": "10℃/9℃","weather": "晴","weather_pic": "http://app1.showapi.com/weather/icon/night/00.png","wind_direction": "无持续风向","wind_power": "微风"},{"hour": "02时-05时 ","temperature": "10℃/9℃","weather": "晴","weather_pic": "http://app1.showapi.com/weather/icon/night/00.png","wind_direction": "无持续风向","wind_power": "微风"},{"hour": "05时-08时 ","temperature": "13℃/10℃","weather": "晴","weather_pic": "http://app1.showapi.com/weather/icon/day/00.png","wind_direction": "无持续风向","wind_power": "微风"}]},"hourDataList": [ //当天每半小时数据的累积数组。当天0点清空重新累积。{"aqi": "53","aqiDetail": {"num": "12","co": "0.3","area": "北京","so2": "3","o3": "52","no2": "16","aqi": "32","quality": "优质","pm10": "15","pm2_5": "6","o3_8h": "62","primary_pollutant": ""},"sd": "85%","temperature": "9","temperature_time": "00:00","weather": "多云","weather_pic": "http://appimg.showapi.com/images/weather/icon/night/01.png","wind_direction": "北风","wind_power": "1级"},{"aqi": "53","aqiDetail": {},"sd": "81%","temperature": "10","temperature_time": "00:30","weather": "多云","weather_pic": "http://appimg.showapi.com/images/weather/icon/night/01.png","wind_direction": "北风","wind_power": "1级"} ],"ret_code": 0,"time": "20151023180000"}
}

里面包含天气图片，可以直接调用，十分方便；数据是实时刷新的，30分钟一次

成果如下：

对接阿里云天气，获取天气预报数据相关推荐

如何将阿里云天气接口中返回的天气图标转换成对应的url
上一篇文章中我们谈到了阿里云天气接口的使用,但是,在这个接口返回的数据中,有一个图标问题是需要我们注意的. 如图所示: 阿里云接口返回的天气图标是一个状态值,拿到之后是没法直接使用的,所以,我们需要将 ...
修改串口设备名ttymxc1_ESP8266接入阿里云——基于官方SDK接入阿里云串口获取云下发数据...
作者:电子快递哥日期:于2020年3月18日有态度,有温度,欢迎关注电子快递哥,转载请注明出处, ESP8266接入阿里云 --之一基于官方SDK接入阿里云串口获取云下发数据一.获取阿里云IoT ...
esp8266 阿里云 arduino_ESP8266接入阿里云——基于官方SDK接入阿里云串口获取云下发数据...
作者:电子快递哥日期:于2020年3月18日有态度,有温度,欢迎关注电子快递哥,转载请注明出处, ESP8266接入阿里云 --之一基于官方SDK接入阿里云串口获取云下发数据一.获取阿里云IoT ...
阿里云IOT设备数据接入（从阿里云IOT云平台获取设备数据）
从阿里云IOT云平台获取设备数据前言: 这篇文档主要讲述的就是当设备的数据发送到物联网套件之后,用户的服务端如何获取设备的数据. 通过阅读阿里云IoT文档,我们了解到队列中消 ...
基于SAML 2.0对接阿里云的SSO(单点登录)
背景公司使用的阿里云作为公有云,每次员工入职或离职时同时需要维护两套账号(一套内部账号,一套阿里云RAM账号),为了让用户能够使用内部账号能访问阿里云,所以决定对接阿里云的SSO 主流程介绍用户访 ...
对接阿里云短信服务（附视频教程）
阿里云短信服务文档使用指引: https://help.aliyun.com/document_detail/59210.html B站视频教程链接: https://www.bilibili.com ...
go 服务接入短信验证码功能（对接阿里云平台）
简介短信验证码还是比较常用的功能,已经有了很成熟的方案,本篇介绍的是对接阿里云的短信服务,一条短信大概两分钱. 基本的流程是: 到对应的云平台申请权限,大致费用都差不多照着官方文档进行对接,并集成 ...
技术内幕 | 阿里云EMR StarRocks 极速数据湖分析
作者:阿里云智能技术专家周康,StarRocks Active Contributor 郑志铨(本文为作者在 StarRocks Summit Asia 2022 上的分享) 为了能够满足更多用户对 ...
Rancher通过Aliyun-slb服务对接阿里云SLB教程
阿里云负载均衡(Server Load Balancer)是将访问流量根据转发策略分发到后端多台云服务器(ECS)的流量分发控制服务. 本文将详尽演示Rancher如何通过Aliyun-slb服务对接 ...
【阿里云物联网平台-1】使用MQTTfx模拟客户端，往阿里云物联网平台发布数据
目录 MQTT协议简单介绍(每句都是干货) 手把手流程服务器:阿里云物联网平台客户端:MQTTfx 后记 MQTT协议简单介绍(每句都是干货) MQTT是应用层协议,基于TCP/IP. 是一种发布 ...

对接阿里云天气，获取天气预报数据

我最近在开发个人网站，为了丰富页面，就新增了一个天气预报的数据展示，写此博客记录一下。

获取天气数据调用的易源数据天气，需要经纬度的参数，因此这里调用了百度地图的api来获取经纬度。具体实现过程如下：

ajax中的请求的url为：https://ali-weather.showapi.com/gps-to-weather?from=5&lat=’+lat+’&lng=’+lng+’&need3HourForcast=0&needAlarm=0&needHourData=0&needIndex=0&needMoreDay=0’

其中部分参数说明：

这个接口正常返回数据结构为：

里面包含天气图片，可以直接调用，十分方便；数据是实时刷新的，30分钟一次

成果如下：

对接阿里云天气，获取天气预报数据相关推荐

最新文章

热门文章