使用高德开放平台API和js的Ajax代码实现定位并获得城市的天气情况
1、注册高德开放平台账号,免费获得Web服务API应用key
高德开放平台Web服务API

按照API点击申请KEY

登录后进入应用管理

新建应用(随意起名)

然后添加key提交即可

然后就可以看到你申请的key

2、编写js的Ajax代码,实现请求服务得到定位
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
</head>
<script>
function getLocation() {
axios
.get("https://restapi.amap.com/v3/ip", {
params: {
key: "e8e0bb95c623fd363f68ca5e3045b5b2",
},
})
.then((data) => {
console.log(data.data);
const span = document.getElementById("city");
span.innerText = data.data.city;
});
}
</script>
<body>
<button onclick="getLocation()">定位</button><span id="city">未知</span>
</body>
</html>
实现效果如下:
点击定位按钮后,得到定位地址

3、根据所获得地址定位获得当前城市的天气情况



















![Linux自启服务提示:systemd[1]: *.service: main process exited, code=exited, status=1问题](https://img-blog.csdnimg.cn/direct/5c625a5acc964b75a12dda16ba7fbbf0.png)
