20161011 天气接口学习及作业总结

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 这种形式表示