当前位置： 首页 > news >正文

获取实时天气

news 2026/3/26 22:50:59

  • 一、用天气API（需要付费） 网址：https://www.tianqiapi.com/

请求方式及url：请求方式：GET接口地址：https://tianqiapi.com/free/day请求示例https://www.tianqiapi.com/free/day?appid=_____&appsecret=______这里appid和APPScrect是两个必要参数，就是我们刚才控制台内记录下的个人的APPID和APPSecret

参数名

必选

类型

说明

备注（示例）

appid

是

string

用户appid

注册开发账号

appsecret

是

string

用户appsecret

version

是

string

接口版本标识

固定值: v61 每个接口的version值都不一样

cityid

否

string

城市ID

请参考 城市ID列表

city

否

string

城市名称

不要带市和区; 如: 青岛、铁西

province

否

string

所在省

如果您担心city重名可传此参数, 不要带省和市; 如: 山东、上海

ip

否

string

IP地址

查询IP所在城市天气

lng

否

String

经度

如: 119.545023 (需额外开通lbs权限, 500/年, 2000/5年)

lat

否

String

纬度

如: 36.044254

point

否

String

坐标体系

默认百度坐标, 如使用高德坐标, 请传参: gaode

callback

否

string

jsonp参数

如: jQuery.Callbacks

vue

否

string

跨域参数

如果您使用的是react、vue、angular请填写值: 1

unescape

否

Int

是否转义中文

如果您希望json不被unicode, 直接输出中文, 请传此参数: 1

备注

cityid、city和ip参数3选一提交，如果不传，默认返回当前ip城市天气，cityid优先级最高。

  • 二、PC项目 使用高德API 获取位置和天气信息

1.在高德地图上申请一个开发者，并且创建一个key 选择web端应用

2.在vue项目中的index.html中 使用script标签 引入生成的key和秘钥

<!DOCTYPE html>
<html><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1.0"><title>你的项目名称</title>
</head><body><script type="text/javascript">window._AMapSecurityConfig = {securityJsCode:'你申请的安全秘钥',}</script><script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=你申请的key"></script><div id="app"></div><!-- built files will be auto injected -->
</body></html>

3.在需要获取位置的页面中定义方法 使用citySearch和weather插件

4.可将获取到的天气信息保存至本地缓存再其他页面拉取渲染，注意要JSON.stringify 转化为JSON字符串，拉取的时候再用JSON.parse将JSON字符串转化为对象

 getLngLatLocation() {let that = this;AMap.plugin("AMap.CitySearch", function () {var citySearch = new AMap.CitySearch();citySearch.getLocalCity(function (status, result) {if (status === "complete" && result.info === "OK") {// 查询成功，result即为当前所在城市信息console.log("通过ip获取当前城市:", result);AMap.plugin("AMap.Weather", function () {//创建天气查询实例var weather = new AMap.Weather();//执行实时天气信息查询weather.getLive(result.city, function (err, data) {console.log("天气", data);if (data) {that.weather = data.weather;that.temperature = data.temperature;that.city = data.city;let weatherObj = {weather: data.weather,temperature: data.temperature,city: data.city,};localStorage.setItem("WEATHER_INFO",JSON.stringify(weatherObj));}else{console.log(err);}});});}});});},

相关文章：

获取实时天气

一、用天气API&#xff08;需要付费&#xff09; 网址&#xff1a;https://www.tianqiapi.com/请求方式及url&#xff1a;请求方式&#xff1a;GET接口地址&#xff1a;https://tianqiapi.com/free/day请求示例https://www.tianqiapi.com/free/day?appid_____&appsecret__…...

编程日记 2023/2/23 5:14:33

【数据库】redis数据持久化

目录 数据持久化 一&#xff0c; RDB 1&#xff0c; 什么是RDB 2&#xff0c;持久化流程 3&#xff0c; 相关配置 案例演示&#xff1a; 4&#xff0c; 备份和恢复 1、备份 2、恢复 3&#xff0c;优势 4&#xff0c; 劣势 二&#xff0c;AOF 1&#xff0c;什么是A…...

编程日记 2023/2/23 5:13:22

前端编译、JIT编译、AOT编译

一、前端编译&#xff1a;java设计之初就是强调跨平台&#xff0c;通过javac将源文件编译成于平台无关的class文件&#xff0c; 它定义了执行 Java 程序所需的所有信息&#xff08;许多Java"语法糖"&#xff0c;是在这个阶段完成的&#xff0c;不依赖虚拟机&#xff…...

编程日记 2023/2/23 5:12:14

父子组件中，子组件调用父组件的方法

父子组件中&#xff0c;子组件调用父组件的方法 方法一&#xff1a;直接在子组件中通过this.$parent.event来调用父组件的方法 父组件 <template><p><child>父组件</child></p> </template> <script>import child from ~/compone…...

编程日记 2023/2/23 5:11:07

第七章.深度学习

第七章.深度学习 7.1 深度学习 深度学习是加深了层的深度神经网络。 1.加深层的好处 1).可以减少网络的参数数量 5*5的卷积运算示例&#xff1a; 重复两次3*3的卷积层示例&#xff1a; 图像说明&#xff1a; ①.一次5 * 5的卷积运算的区域可以由两次3 * 3的卷积运算抵消&a…...

编程日记 2023/2/23 5:10:02

小学生学Arduino---------点阵（三）动态的显示与清除

学习目标&#xff1a; 1、理解“整数值”的概念与使用 2、理解“N1”指令的意义 3、掌握“反复执行多次”指令的使用 4、掌握屏幕模块的清除功能指令 5、理解“反复执行”指令与“反复执行多次”指令的嵌套使用 6、搭建电路图 7、编写程序 效果&#xff1a; 整数包括&#xf…...

编程日记 2023/2/23 5:08:56

opencv图片处理

目录1 图片处理1.1 显示图片1.2 旋转图片1.3 合并图片1.4、Mat类1.4.1、像素的储存结构1.4.2、访问像素数据1.6、rgb转灰度图1.7、二值化1.8、对比度和亮度1.9、图片缩放1.9.1、resize临近点算法双线性内插值1.9.2、金字塔缩放1.10、图片叠加1 图片处理 1.1 显示图片 #includ…...

编程日记 2023/2/23 5:07:47

C++ Primer Plus 学习笔记（二）—— 复合类型

数组 当我们只是定义了数组&#xff0c;而没有对数组进行初始化时&#xff0c;那数组的值将是未定义的。 在对数组进行初始化时&#xff0c;如果只对数组的一部分进行初始化&#xff0c;编译器会将把其他元素自动设置为0。 #include <iostream>using namespace std;in…...

编程日记 2023/2/23 5:06:40

代码随想录算法训练营第七天 | 454.四数相加II 、 383. 赎金信、15. 三数之和、18. 四数之和 、总结

打卡第七天&#xff0c;还是哈希表。 今日任务 454.四数相加II383.赎金信15.三数之和18.四数之和总结 454.四数相加II 代码随想录 class Solution { public:int fourSumCount(vector<int>& nums1, vector<int>& nums2, vector<int>& nums3, ve…...

编程日记 2023/2/23 5:05:34

apply函数族

apply函数族 apply函数族是R语言中帮助用户实现高效的向量化运算的一系列函数&#xff0c;包括apply,lapply,sapply,vapply等。 apply() apply函数以列或行为单位进行循环操作&#xff0c;可以处理matrix、array数据&#xff0c;返回一个向量或matrix。 apply(data,1/2,fuc…...

编程日记 2023/2/23 5:04:21

读书笔记可读性素材

《深入理解Java虚拟机》 《深入理解Java虚拟机》 《深入理解Java虚拟机》 本地方法栈&#xff08;Native Method Stacks&#xff09; 本地方法栈&#xff08;Native Method Stacks&#xff09; 本地方法栈&#xff08;Native Method Stacks&#xff09; -----------------…...

编程日记 2023/2/23 5:03:13

【C++】vector 模拟实现

vectorvector 容器vector 基本使用vector 定义库中各类接口的使用迭代器容量相关接口元素访问相关接口元素修改相关接口模拟实现 vector前期准备构造与析构赋值运算符重载迭代器相关容量相关元素访问相关元素的修改相关二维数组的创建对于自定义类型数据的测试vector 容器 C S…...

编程日记 2023/2/23 5:02:08

canvas初体验

canvas介绍 Canvas 最初由Apple于2004 年引入&#xff0c;用于Mac OS X WebKit组件&#xff0c;为仪表板小部件和Safari浏览器等应用程序提供支持。后来&#xff0c;它被Gecko内核的浏览器&#xff08;尤其是Mozilla Firefox&#xff09;&#xff0c;Opera和Chrome实现&#x…...

编程日记 2023/2/23 5:01:01

JavaWeb12-线程通讯（线程等待和唤醒）

目录 1.方法介绍 1.1.wait()/wait(long timeout)&#xff1a;让当前线程进入等待状态。 1.1.1.wait执行流程 1.1.2.wait结束等待的条件 1.1.3.wait() VS wait(long timeout) 1.1.4.为什么wait要放在Object中&#xff1f; --->PS&#xff1a;wait(0) 和 sleep(0) 的区…...

编程日记 2023/2/23 4:59:52

江苏专转本如何事半功倍的备考

专转本如何事半功倍的备考 一个人学习成绩的优劣取决于他的学习能力&#xff0c;学习能力包括三个要素&#xff1a;规范的学习行为&#xff1b;良好的学习习惯&#xff1b;有效的学习方法。有了规范的学习行为才能培养出良好的学习习惯&#xff0c;形成了良好的学习习惯就会形成…...

编程日记 2023/2/23 4:58:42

linux下安装mongoDB

一、下载mongoDB包 下载地址&#xff1a; https://www.mongodb.com/try/download/community 个人建议&#xff1a;如果是学习阶段&#xff0c;使用5以下版本更好些。 二、安装及配置 1、安装 # 1、解压 $ tar -zxvf mongodb-linux-x86_64-rhel70-4.4.19-rc1.tgz# 2、迁移目…...

编程日记 2023/2/23 4:57:31

掌握MySQL分库分表（七）广播表、绑定表实战，水平分库+分表实现及之后的查询和删除操作

文章目录什么是广播表广播表实战数据库配置表Java配置实体类配置文件测试广播表水平分库分表配置文件运行测试什么是绑定表&#xff1f;绑定表实战配置数据库配置Java实体类配置文件运行测试水平分库分表后的查询和删除操作查询操作什么是广播表 指所有的分片数据源中都存在的…...

编程日记 2023/2/23 4:56:22

企业为什么需要数据可视化报表

数据可视化报表是在商业环境、市场环境已经改变之后&#xff0c;发展出来为当前企业提供替代解决办法的重要方案。而且信息化、数字化时代&#xff0c;很多企业已经进行了初步的信息化建设&#xff0c;沉淀了大量业务数据&#xff0c;这些数据作为企业的资产&#xff0c;是需要…...

编程日记 2023/2/23 4:55:14

5个有效的华为（HUAWEI）手机数据恢复方法

5个有效的手机数据恢复方法 华为智能手机中的数据丢失比许多人认为的更为普遍。发生这种类型的丢失有多种不同的原因&#xff0c;因此数据恢复软件的重要性。您永远不知道您的智能手机何时会在这方面垮台&#xff1b;因此&#xff0c;预防总比哀叹好&#xff0c;这就是为什么众…...

编程日记 2023/2/23 4:54:06

【Java并发编程】线程安全（一）Synchronized原理

Synchronized底层实现 简单来说&#xff0c;Synchronized关键字的执行主体是线程对象&#xff0c;加锁是通过一个锁对象来完成的是&#xff0c;而锁对象底层关联了一个c源码的monitor的对象&#xff0c;monitor对象底层又对应了操作系统级别的互斥锁&#xff0c;同一时刻只有一…...

编程日记 2023/2/23 4:52:57

360CDN 全系列产品体验：CDN / 高防 / SDK 游戏盾横向测评

作为深耕互联网技术领域多年的开发者&#xff0c;平时无论是个人项目还是公司业务&#xff0c;都经常需要用到CDN加速、网络防护类产品。近期正好完整上手测试了360CDN全系列核心产品&#xff0c;涵盖基础CDN加速、高防CDN、SDK游戏盾三款&#xff0c;全程以真实业务场景为测试…...

编程新知 2026/3/26 21:58:04

AI绘画新革命：SDXL-Turbo镜像快速上手与实战测评

AI绘画新革命&#xff1a;SDXL-Turbo镜像快速上手与实战测评 想象一下这样的场景&#xff1a;你刚输入完几个单词&#xff0c;屏幕上就立即呈现出对应的图像。没有等待&#xff0c;没有延迟&#xff0c;就像思维直接转化为画面一样流畅。这就是SDXL-Turbo带来的AI绘画新体验—…...

编程新知 2026/3/26 21:46:01

告别鉴权内耗，让每一位Java开发者都能轻松上手

写Java的这些年&#xff0c;无论是初入职场的新手&#xff0c;还是深耕多年的老兵&#xff0c;谁没在「鉴权」上栽过跟头&#xff1f; 熬夜啃Spring Security的复杂配置&#xff0c;对着一堆过滤器链抓耳挠腮&#xff1b;用Shiro做前后端分离项目&#xff0c;为了适配Token模式…...

编程新知 2026/3/26 18:42:39

不止于集成：在RuoYi-Camunda流程设计器中实现自定义属性面板与FEEL表达式校验

深度定制RuoYi-Camunda流程设计器&#xff1a;从属性面板扩展到FEEL表达式校验实战 当标准BPMN设计器无法满足复杂业务需求时&#xff0c;定制化开发成为必经之路。某跨国零售企业的审批系统曾因无法在流程节点上定义"区域经理审批阈值"字段&#xff0c;导致每次业务…...

编程新知 2026/3/26 17:03:19

如何零配置搭建专业级视觉交互系统：MediaPipe TouchDesigner完全指南

如何零配置搭建专业级视觉交互系统&#xff1a;MediaPipe TouchDesigner完全指南 【免费下载链接】mediapipe-touchdesigner GPU Accelerated MediaPipe Plugin for TouchDesigner 项目地址: https://gitcode.com/gh_mirrors/me/mediapipe-touchdesigner 想要在TouchDes…...

编程新知 2026/3/26 16:51:18

别再纠结了！Android音视频开发选软解(FFmpeg)还是硬解(MediaCodec)？一个实战Demo帮你做决定

Android音视频开发实战&#xff1a;软解与硬解的性能对决 在移动端音视频开发领域&#xff0c;选择软解还是硬解一直是个令人头疼的问题。每次技术选型会议上&#xff0c;总能看到两派开发者争得面红耳赤——软解支持者强调其灵活性和兼容性&#xff0c;硬解拥趸则推崇其性能和…...

编程新知 2026/3/26 16:16:54

嵌入式系统常用轻量级校验算法解析

单片机中常用的轻量级校验算法 1. 校验算法概述 在嵌入式系统开发中&#xff0c;数据校验是确保通信可靠性和数据完整性的关键技术手段。无论是UART通信中的奇偶校验、CAN总线中的CRC校验&#xff0c;还是Modbus、MAVlink、USB等协议中的校验机制&#xff0c;都体现了校验算法…...

编程新知 2026/3/26 14:57:55

PHY6252：解锁蓝牙5.2 SOC在物联网与可穿戴设备中的低功耗高性能设计

1. PHY6252&#xff1a;重新定义蓝牙5.2 SOC的边界 第一次拿到PHY6252开发板时&#xff0c;我习惯性地看了一眼电流表——13μA的睡眠模式功耗让我立刻意识到&#xff0c;这绝不是一款普通的蓝牙芯片。作为深耕物联网领域多年的开发者&#xff0c;我见过太多标榜"低功耗&q…...

编程新知 2026/3/26 14:17:20

Qwen2.5-Coder-1.5B新手指南：如何用‘fill-in-the-middle’模式补全代码

Qwen2.5-Coder-1.5B新手指南&#xff1a;如何用‘fill-in-the-middle’模式补全代码 重要提示&#xff1a;Qwen2.5-Coder-1.5B是一个专门用于代码任务的预训练模型&#xff0c;不适合直接用于对话。它最擅长的场景是代码补全、生成和修复&#xff0c;特别是使用"fill-in-t…...

编程新知 2026/3/26 13:49:00

告别传统拍摄：THE LEATHER ARCHIVE低成本生成高质量皮衣展示图

告别传统拍摄&#xff1a;THE LEATHER ARCHIVE低成本生成高质量皮衣展示图 1. 时尚行业的数字革命 在时尚电商领域&#xff0c;商品展示图的质量直接影响消费者的购买决策。传统皮衣拍摄面临三大痛点&#xff1a; 高昂成本&#xff1a;专业模特、摄影师、场地租赁等费用动辄…...

编程新知 2026/3/26 13:47:00