高德地图api接口免费查询天气实战案例，axios请求查询天气，js版，【接上一篇微信测试号推送纪念日】

提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档

---

前言

心血来潮想搞一个天气查询

看了网上很多的天气查询接口，发现很多，要么就是付费的，要么就是免费但是不稳定，不知道啥时候就失效了。
正好高德地图有查询天气的接口，但是教程很少，这里出一期高德地图查询天气

---

一、高德地图

必须要用到高德地图的key，所以得注册开发者账号

1、注册高德地图

首先登录注册高德地图开发平台
高德官网

2、创建应用

在你的控制台页面》应用管理》我的应用，这里添加一个应用

3、为你的应用添加key

在创建应用好了之后，是没有任何东西的。
这时候要添加一个key，非常简单。看图吧

必须选择Web服务端

因为只有web服务才有天气查询，如果选错了，删除重新添加。

这里我都确认过了，创建web端就好了。

创建完了之后，你会获得一个key，记住这个key，待会要用

二、编写代码

由于我是基于js来写的，js的请求有很多，比如ajax、axios

我这里用axios来请求，ajax原理是一样的、写法不同而已，这里不做演示。

---

1.封装get请求和post请求

代码如下（示例）：

// 万能请求封装
const axios = require('axios');
// 设置跨域请求头
axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
// 定义post请求方法
const axiosPost = function (url, params) {
    return new Promise((resolve, reject) => {
        axios
            .post(url, params)
            .then(res => {
                resolve(res);
            })
            .catch(err => {
                reject(err);
            });
    });
};
// 定义get请求方法
const axiosGet = function (url, params) {
    return new Promise((resolve, reject) => {
        axios
            .get(url, {
                params,
            })
            .then(res => {
                resolve(res);
            })
            .catch(err => {
                reject(err);
            });
    });
};
// 用法
async function getToken() {
    const params = {
        appid: '', // 你的appid  1
        secret: '', // 你的secret 2
    };
    let res = await axiosGet('https://api.weixin.qq.com/cgi-bin/token', params);
    // let res = await axiosPost(url, params);  post同理
    return res.data.access_token;
}
// 执行方法，如果需要同步、前面加上  await
getToken()
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44

这里是把get和post请求做了封装处理，就是参数处理了一下。
如果要添加方法，仿写这个getToken就好了，非常简单

---

2.编写请求城市adcode代码

为啥要获取城市的adcode区域编码？

我看了几篇关于用高德地图查询天气的文章，他们都是根据城市名，市+区就能查到，但是教程都是20年、19年的。

高德地图后面改了，只能用编码来获取天气，如图

所以，要想查天气，就得知道你城市的adcode编码，刚好高德地图可以通过查询地址，返回值就有adcode编码

把getToken改写一下（如下所示）：

async function getCity() {
    const params = {
        key: '', // 你的key  1
        address: '湖南省长沙市芙蓉区', // 你的地址信息 2
    };
    let res = await axiosGet('https://restapi.amap.com/v3/geocode/geo?parameters', params);
    // let res = await axiosPost(url, params);  post同理
    console.log('打印res：', res.data)
    // return res.data
}
// 执行方法
getCity()
1
2
3
4
5
6
7
8
9
10
11
12

把你的key值填进去，然后执行这个js，nodeJs的执行原理就是node ***.js

3.获取城市adcode编码运行成功

把adcode编码返回出来就好了，这里用return

async function getCity() {
    const params = {
        key: '', // 你的key  1
        address: '湖南省长沙市芙蓉区', // 你的地址信息 2
    };
    let res = await axiosGet('https://restapi.amap.com/v3/geocode/geo?parameters', params);
    // let res = await axiosPost(url, params);  post同理
    // console.log('打印res：', res.data.geocodes)
    return res.data.geocodes[0].adcode // 注意，geocodes是个数组
}
1
2
3
4
5
6
7
8
9
10

把打印语句注释，加上return

4.用adcode城市编码获取天气

现在来编写获取城市天气的代码
官网文档

async function getWeather() {
    const adcode = await getCity();
    const params = {
        key: '', // 你的key  1
        city: adcode,
        extensions: 'base'
    };
    let res = await axiosGet('https://restapi.amap.com/v3/weather/weatherInfo?parameters', params);
    console.log('打印res：', res.data.lives[0])
    // {
    //   province: '湖南',      省份名
    //   city: '芙蓉区',        城市名
    //   adcode: '430102',      区域编码
    //   weather: '晴',         天气现象
    //   temperature: '33',     气温
    //   winddirection: '西',   风向
    //   windpower: '≤3',       风力级别
    //   humidity: '28',        空气湿度
    //   reporttime: '2022-09-16 15:31:31'
    // }
}
getWeather()
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

---

总结

获取到天气的信息之后，就可以拿来结合上一篇微信测试号发送信息，像token一样，return出去，然后接收，使用。

基于nodeJs运行，需要电脑安装了nodejs，并且运行环境下有axios

安装语句

npm install axios
1

必须要有node_nodules依赖文件，才能执行这个js文件，

白嫖党看这里，代码成品，cv食用

代码成品，复制可用，简洁明了带注释

// 只需要填入key和你的城市信息，已经标记出来了
const axios = require('axios');
// 设置跨域请求头
axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
// 定义post请求方法
const axiosPost = function (url, params) {
    return new Promise((resolve, reject) => {
        axios
            .post(url, params)
            .then(res => {
                resolve(res);
            })
            .catch(err => {
                reject(err);
            });
    });
};
// 定义get请求方法
const axiosGet = function (url, params) {
    return new Promise((resolve, reject) => {
        axios
            .get(url, {
                params,
            })
            .then(res => {
                resolve(res);
            })
            .catch(err => {
                reject(err);
            });
    });
};
// 获取城市编码
async function getCity() {
    const params = {
        key: '', // 你的key  1
        address: '湖南省长沙市芙蓉区', // 你的地址信息 2
    };
    let res = await axiosGet('https://restapi.amap.com/v3/geocode/geo?parameters', params);
    return res.data.geocodes[0].adcode
}

async function getWeather() {
    const adcode = await getCity();
    const params = {
        key: '', // 你的key  1
        city: adcode,
        extensions: 'base'
    };
    let res = await axiosGet('https://restapi.amap.com/v3/weather/weatherInfo?parameters', params);
    console.log('打印res：', res.data.lives[0])
    // {
    //   province: '湖南',      省份名
    //   city: '芙蓉区',        城市名
    //   adcode: '430102',      区域编码
    //   weather: '晴',         天气现象
    //   temperature: '33',     气温
    //   winddirection: '西',   风向
    //   windpower: '≤3',       风力级别
    //   humidity: '28',        空气湿度
    //   reporttime: '2022-09-16 15:31:31'
    // }
}
getWeather()
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64

key被复用了，可以把它丢在外面，但是懒得写了，网友拿去改吧