当前位置:网站首页 > Vue.js开发 > 正文

天气预报接口(天气预报接口调用方法js)



开头先说一下,以防有萌新看不懂,所以以下代码注释写的比较多,思路讲的比较清楚,不喜勿喷哈哈哈哈

HTML代码:

JS代码:

1.首先,我们应该先获取当前我们当前的ip地址,利用ip地址找到我们身处的具体位置信息,让网页加载的第一时间获取到我们当前身处的具体位置,从而获取当前地区的天气信息

2.获取到ip地址后,我们应该利用ip地址来获取当前ip地址下的天气信息

3.获取到当前ip下的天气预报信息后,我们还想通过切换地区来获取别的地区的天气信息

以上我们就可以获取我们当前地区的天气预报信息和切换地区后更新天气预报信息,主要涉及到同源策略和跨域的问题,当遇到不同源的url时,我们可以通过jQuery的$.ajax方法的dataType属性设置为jsonp的形式,可以实现不同源跨域获取服务器数据

我做这个天气预报时,遇到较多的问题就是天气预报的API接口不能用,获取API接口能用但是获取到的数据我们无法使用,即使格式化了也是无法使用的,找了很久才找到了这两个API接口,亲测目前是能够使用的,过段时间我就不知道了。第一个动态获取当前ip地址的API,url是https://bird.ioliu.cn/ip,请求方式为get,dataType数据类型为jsonp,第二个是获取某城市当前天气预报的API,url是https://www.tianqiapi.com/api/?version=v1&city=,参数有多个,可以是city(城市名称),可以是ip(ip地址),可以是cityid(城市编号),请求方式为get,dataType数据类型为jsonp,具体参考该接口文档

到此这篇天气预报接口(天气预报接口调用方法js)的文章就介绍到这了,更多相关内容请继续浏览下面的相关推荐文章,希望大家都能在编程的领域有一番成就!

版权声明


相关文章:

  • redhat linux忘记root密码(redhat7.4忘记root密码)2025-09-02 19:36:10
  • 环回地址可以作为目的地址吗(环回地址必须是127.0.0.1吗)2025-09-02 19:36:10
  • spss 27(spss 27.0是什么时候发布的?)2025-09-02 19:36:10
  • pcie5.0固态硬盘推荐(pcie5.0 硬盘)2025-09-02 19:36:10
  • ubuntu无法定位软件包怎么办(ubuntu18.04无法定位软件包)2025-09-02 19:36:10
  • redhat6.2安装教程(redhat6.0安装教程)2025-09-02 19:36:10
  • list转化为string(list转化为jsonarray)2025-09-02 19:36:10
  • pcie5.0和pcie4.0区别显卡(pcie 4.0对显卡的性能提升有多大)2025-09-02 19:36:10
  • vue安装使用(vue ui安装)2025-09-02 19:36:10
  • map转json空值没了(map转json对象)2025-09-02 19:36:10
  • 全屏图片