开发指南071-进度展示

简介: 前端发起一个比较长时间的服务,需要在前端刷新实时进度,告诉用户进展

前端发起一个比较长时间的服务,需要在前端刷新实时进度,告诉用户进展。不是假进度条,是实际的进度,例如需要更新1000条数据,则前端不断刷新 已完成数/1000

      前端发起服务,注意生成一个taskID:

import uuid from "node-uuid";

this.taskID=uuid.v1()

     生成一个定时任务this.intervalId = setInterval(() => { this.fetchProgress(); }, 3000); // 每3秒轮询一次

     向后台发起请求,传递该参数。

      后台先计算任务总数,然后向redis以该键值存储的实时进度信息,然后进入循环,边完成任务,边刷新redis。

      定时任务调后台job服务的相关接口获取进度。

      后台完成定时任务后会销毁redis数据

      前端接收到返回后,显示服务结果,同时停止定时任务。

相关文章
|
SQL 小程序 前端开发
【易售小程序项目】商品详情展示+评论、评论展示、评论点赞+商品收藏【后端基于若依管理系统开发】
【易售小程序项目】商品详情展示+评论、评论展示、评论点赞+商品收藏【后端基于若依管理系统开发】
116 0
|
7月前
|
存储 前端开发 小程序
Uniapp数据展示
Uniapp数据展示
67 0
|
API
Echarts实战案例代码(28):象形图与dataZoom组件实现大事记进度图
Echarts实战案例代码(28):象形图与dataZoom组件实现大事记进度图
196 0
|
前端开发 数据可视化 JavaScript
漏刻有时数据可视化大屏核心框架模版更换前端模版操作(2)API开发及数据调用
漏刻有时数据可视化大屏核心框架模版更换前端模版操作(2)API开发及数据调用
93 0
|
前端开发 小程序 API
微信小程序2.9.0基础库canvas2D新API,生成海报保存到手机功能实现
微信小程序2.9.0基础库canvas2D新API,生成海报保存到手机功能实现
367 0
|
前端开发
A2021-A2022项目展示页面的内容。
A2021-A2022项目展示页面的内容。
98 0
A2021-A2022项目展示页面的内容。
|
JSON Java API
HarmonyOS实战—天气类卡片设计(一)
HarmonyOS实战—天气类卡片设计(一)
263 0
HarmonyOS实战—天气类卡片设计(一)
|
SQL 前端开发 JavaScript
9-点击流数据分析项目-前后端展示
文章目录 9-点击流数据分析项目-前端展示 数据库配置 执行sql文件 创建maven项目 配置pom文件
9-点击流数据分析项目-前后端展示
|
前端开发
前端工作小结72-实现预览效果
前端工作小结72-实现预览效果
111 0
前端工作小结72-实现预览效果
|
JSON JavaScript Java
HarmonyOS实战—天气类卡片设计(二)
HarmonyOS实战—天气类卡片设计(二)
195 0
下一篇
无影云桌面