微信小程序实现天气预报接入

2024-05-09 17:30:32

第一种方法：

1、后台接入第三方平台获取最近的天气预报信息

2、将数据返回给前端，此时返回信息的是最近所有的天气预报信息例如（当前8月3号10点整返回的会从当前8月3号10点整-8月5号10点整中间所有时间段的天气注意返回的均是整点信息）

3、获取当前时间戳，判别时间戳是否在返回的信息中，返回对应的天气信息

4、小程序前端渲染需要以循环的方式取值，因为天气信息返回是一个二维对象

出现问题

1、后台返回的数据为整点时间段信息，而当前时间戳是具体时间段，所以这里在测试的时候，写了整点时间戳去测试数据。但是我们实际场景中，一定是以当前具体时间去获取数据。

举例场景：后台返回来数据是8月3日10点的数据，我们可以在10点获取到数据后，但在10点01分就失去数据，因为当前时间戳不在返回的数据里面。

预期效果：数据应该是保存一个小时，到了下个时间段自动刷新。

解决思路：以时间日期的格式去判别。当前时间是在那个整点

首先获取当前时间戳。将其转换成日期格式。小程序直接转换的格式是年/月/日时：分：秒

而天气预报返回的日期格式是年-月-日时：分:秒：

所以第二步需要去util 文件里面封装一个重写时间日期格式函数文件，将我们的当前时间格式转换成于天气预报返回的日期格式一样

第三步比对时间数据举例当前返回天气最新时间是 2022-8-3 10：00:00 我们的当前时间为 2022-8-3 10：30：00 我们只需要比对（年-月-日时）的数据一致就能获得数据

第二种方法

1、后台接入第三平台。根据当前时间戳返回对应天气信息

2、前端直接获取接口数据，进行渲染

是不是第二种是实现更加的简便了。这里我尝试过着两种方案。在第一种花费了较多的时间。然后豁然开朗。其实完全就可以在后台判别一下就好了。所以贴出来。避免大家踩坑

推荐使用第二种，第一种方法开发时候发现需要单独封装在util文件，只做一种场景的时候还是ok的，但是个人开发测试时候，出现了冲突，原因为我在做短信发送时候延迟发送，也是需要时间戳，这里的时间函数重写之后。很难去解决。

微信小程序实现天气预报接入相关推荐

微信小程序积分商城接入兑吧
微信小程序积分商城接入兑吧用户获取积分后,可进入积分通兑商城消耗用户企业积分进行兑换:提高用户满意度及用户黏性. 积分商城说明 1.兑吧的积分商城为HTML5页面,需要通过小程序的<web-v ...
vue+uni-app商城实战 | 第一篇：从0到1快捷开发一个商城微信小程序，无缝接入OAuth2实现一键授权登录
一. 前言本篇通过实战来讲述如何使用uni-app快速进行商城微信小程序的开发以及小程序如何接入后台Spring Cloud微服务. 有来商城 youlai-mall 项目是一套全栈商城系统,技术栈 ...
微信小程序直播如何接入？开源代码接入案例分享
小程序直播组件接入指引一.简介小程序直播,是微信提供给小程序开发者的直播组件.通过调用该组件,商家可以在小程序中实现直播功能. 按下面的使用说明接入,在你的小程序中引入直播组件. 二.使用方法说明 ...
微信小程序实现天气预报功能（内置自动定位）（源码）
文章目录序言样例图和风天气API获取微信小程序后台域名配置页面代码相关问题源码留言序言此小程序使用的是最新和风天气API. 样例图和风天气API获取在这个小程序中我使用的是和风 ...
微信小程序实现天气预报功能(附源码)
目录前言效果图天气API获取微信小程序后台域名配置页面代码注意问题(必看) 留言前言最近在学小程序开发,刚好学到天气预报功能的制作,于是给大家分享下. 效果图天气API获取这里我用 ...
微信小程序实现天气预报功能（支持自动定位）（附源码）
目录前言效果图天气API获取微信小程序后台域名配置页面代码注意问题(必看) 源码留言前言由于和风天气API的更新,之前写的那篇文章可能会出现版本不兼容的情况.所以更新了这个 ...
微信小程序之天气预报
入门小程序之后跟着视频做了一个简易版的"天气预报",在手机运行的话能准确定位所在城市并查询到相应的天气状况,页面就一个,功能也不复杂,主要调用了百度地图api查询所在位置和和天气a ...
微信小程序实例——天气预报开发笔记（进行中...）
★ 背景 [提示]:正在补充更新中- 首先,附上一张效果图. 之前就有关注过小程序的发展,感觉可以抽一点的时间来学习一下,通过官方文档以及提供的示例 Demo,发现兴趣挺高,不失为一个可以扩展自身技能 ...
微信小程序（天气预报）开发文档
相关Demo以放到github上 ---------飞机------------https://github.com/193Eric/XCXdemo.git 小程序技术文档一．小程序应用分析 1. ...

最新文章

热门文章