20161011 天气接口学习及作业总结
准备工作
到 http://www.weatherdt.com/ 申请账号,并申请 免费体验版(只包含 北上广深四大站点)
下载所有的文档 以及图标包
作业
单页多应用完成一个天气接口查询
作业总结
此作业的前端样式基本仿照了老师的布局
初始化城市数据
其实就只有北京、上海、广州、深圳 四个城市(四条数据),查询昌平会提示“未订购该站数据”
接口数据格式
{"forecast":{"24h":{"101010100":{"1001001":[{"006":"0","008":"0","007":"0","003":"17","004":"11","001":"07","005":"0","002":"07"},{"006":"0","008":"0","007":"0","003":"21","004":"12","001":"02","005":"0","002":"00"},{"006":"0","008":"0","007":"0","003":"21","004":"11","001":"00","005":"0","002":"00"}],"000":"201610150800"}}}}
接口内容 | 说明 |
---|---|
forecast | 代表预报,其实是由调用的接口的那个网址中规定的 |
24h | 代表 逐24小时预报 |
101010100 | 城市编码ID,可从其文档中找到所有城市的ID表 |
1001001 | 数据类型编号代表预报 |
{"006":"0","008":"0",……} | 一天完整的天气情况,根据天气预报文档中标注的参数进行解析 |
查询核心功能
使用request模块去获得接口数据:
request(weatherUrl, function (error, response, data) {
if (!error && response.statusCode == 200) {
var jsonResult = JSON.parse(data);
console.log(data);
var re = jsonResult['forecast']['24h'][areaID];
var content = re['1001001'];
if (content!=null && content.length == 3) {
var arr = [];
for (var i = 0; i < content.length; i++) {
//weatherDecode方法是将返回的数据进行解析
arr.push(weatherDecode(content[i]));
}
res.json(['success', {'city': city, 'updateTime': re['000'], 'weather': arr}]);
} else {
res.json(['failed', {msg: '接口信息错误'}]);
}
}
});
此处遇到一个坑,我将所有的编码进行解析(其中部分json的键解析为了中文),导致无法使用json的下标(键)取值。
前端直接取值并解析即可
另外一个坑:天气现象编码表,网页中的与文档中的有出入。区别在于前十个数字,网页中使用 0 1 2 3 这种类型表示,而文档中使用 00 01 02 03 这种形式表示