最近在做项目中要用到调用天气接口,在网上找了很多资料之后发现https://www.tianqiapi.com/的天气API挺好的,好用而且免费,调用也很简单。在此做个笔记,大家一起学习交流,如有问题欢迎指正。

天气API文档截图:appid及appsecret通过申请在 用户中心查看。cityid如果不添加默认的是当前IP地址所在的地区。

ajax代码:result中返回的是近7天的天气预报情况,由于我这边只需要去当天的直接就取了data[0]。

 Hqtq() {

                        this.ajax({
//url: 'https://www.tianqiapi.com/api/',
url:'https://www.tianqiapi.com/api/?version=v1&appid=XXXX&appsecret=$$$$$',
success: function(result) {
this.Weatherdata = result.data[0]; }
}) }

HTML代码:前端用了Vue.js

<div><a class="Weatherssd">{{Weatherdata.tem2}}</a><a class="WeatherState">{{Weatherdata.wea}}</a><a class="WeatherDate">{{Weatherdata.date}} {{Weatherdata.week}}</a><a class="WeatherPersent">{{Weatherdata.humidity}}%</a></div>

ajax调用免费的天气API的更多相关文章

  1. 免费的天气API测试接口

    网上几乎所有的天气接口都需要注册key,然后还各种频率限制,每天调用次数才几百次? 太坑爹了吧 一个简单的天气预报功能, 为什么要搞的这么复杂, 收什么费? 推荐一个真正免费的天气API接口, 返回j ...

  2. Django使用AJAX调用自己写的API接口

    Django使用AJAX调用自己写的API接口 *** 具体代码和数据已上传到github https://github.com/PythonerKK/eleme-api-by-django-rest ...

  3. 免费的天气API

    高德地图天气 天气查询-API文档 请求示例: { "status": "1", "count": "1", " ...

  4. 天气API接口的使用

    最近项目中使用到了天气预报的功能,需要从网上获取天气数据,然后显示在公司系统的页面上. 在这里和大家分享下我的做法,希望能对大家有所帮助,如果有错误,欢迎大家指正. 先给大家看看效果: 下面开始进行讲 ...

  5. JAVA的免费天气api接口调用示例

    step1:选择本文所示例的接口"免费天气api" url:https://www.juhe.cn/docs/api/id/39/aid/87 step2:每个接口都需要传入一个参 ...

  6. c#代码 天气接口 一分钟搞懂你的博客为什么没人看 看完python这段爬虫代码,java流泪了c#沉默了 图片二进制转换与存入数据库相关 C#7.0--引用返回值和引用局部变量 JS直接调用C#后台方法(ajax调用) Linq To Json SqlServer 递归查询

    天气预报的程序.程序并不难. 看到这个需求第一个想法就是只要找到合适天气预报接口一切都是小意思,说干就干,立马跟学生沟通价格. ​ ​不过谈报价的过程中,差点没让我一口老血喷键盘上,话说我们程序猿的人 ...

  7. ASP.NET实现二维码 ASP.Net上传文件 SQL基础语法 C# 动态创建数据库三(MySQL) Net Core 实现谷歌翻译ApI 免费版 C#发布和调试WebService ajax调用WebService实现数据库操作 C# 实体类转json数据过滤掉字段为null的字段

    ASP.NET实现二维码 using System;using System.Collections.Generic;using System.Drawing;using System.Linq;us ...

  8. DataTables学习:从最基本的入门静态页面,使用ajax调用Json本地数据源实现前端开发深入学习,根据后台数据接口替换掉本地的json本地数据,以及报错的处理地方,8个例子(显示行附加信息,回调使用api,动态显示和隐藏列...),详细教程

    一.DataTables  个人觉得学习一门新的插件或者技术时候,官方文档是最根本的,入门最快的地方,但是有时候看完官方文档,一步步的动手写例子,总会出现各种莫名其妙的错误,需要我们很好的进行研究出错 ...

  9. ajax调用.net API项目跨域问题解决

    ajax调用.net API项目,经常提示跨域问题.添加如下节点代码解决:httpProtocol <system.webServer> <handlers> <remo ...

随机推荐

  1. 从后端到前端之Vue(四)小试牛刀——真实项目的应用(树、tab、数据列表和分页)

    学以致用嘛,学了这么多,在真实项目里面怎么应用呢?带着问题去学习才是最快的学习方式.还是以前的那个项目,前后端分离,现在把前端换成vue的,暂时采用脚本化的方式,然后在尝试工程化的方式. 现在先实现功 ...

  2. 解读Android MediaPlayer 详细使用方法

        MediaPlayer具有非常强大的功能,对音视频的播放均提供了支持,为了保证播放期间系统的正常工作,需要设置"android.permission.WAKE_LOCK"权 ...

  3. opencv编译

    1. clone源码 https://github.com/opencv/opencv 2. 安装cmake 3. cmake配置的时候,输出目录需要另外设置一个目录,不可以放到源码目录 4. 用cm ...

  4. 带新手玩转MVC——不讲道理就是干(下)

    带新手玩转MVC——不讲道理就是干(下) 前言:废话不多说,直接开干 完整案例演示 案例代码 LoginServlet package servlet; import domain.User; imp ...

  5. HPU暑期集训积分赛1

    A. Nth power of n 单点时限: 1.0 sec 内存限制: 512 MB 求 nn 的个位数. 输入格式 多组输入,处理到文件结束.每组数据输入一个 n.(1≤n≤109) 输出格式 ...

  6. case和decode的用法(行转列)

    创建了一张成绩表,如下图所示: 在oracle中,这两个函数我们都可以使用,代码及结果如下: decode用法: select Name,decode(Subject,'语文',1,'数学',2,'英 ...

  7. PyCharm字体大小调整

    1.点击左上角File----settings----keymap----------搜索increase,选中,increase font size--------再选择enter mouse sh ...

  8. "A valid provisioning profile for this executable was not found"问题

    时间:2015年8月14日 初接触iOS,这两天真机调试的时候遇到了这个问题.如图所示: 上网查后发现,解决方法大致有以下两种: 1. provisioning profile没有被找到,需要重新导入 ...

  9. How to extract WeChat chat messages from a smartphone running Android 7.x or above

    A friend of mine she was frustarted in extracting WeChat chat messages from suspect's smartphone run ...

  10. 【POJ - 1064】Cable master(二分)

    Cable master Descriptions 输入2个数 N  K n条绳子    要分成大于等于k段 求每段最长多长呢?并且每段不能小于1cm 必须以厘米精度写入数字,小数点后正好是两位数.如 ...