前端如何实现后端运行进度_前端动态获取后台处理进度显示在进度条上
实现思路
https://blog.csdn.net/q1w2e3r4470/article/details/72702406
我主要是借鉴了这篇博客的思路
我来简述一下他的思路，他前端用到了ajax异步请求，一个用于获取冗长的数据，就比如我后台要跑一千次统计，是需要很长时间的，另一个是一个周期ajax，每隔一段时间就去后台访问拿数据，后台巧妙的地方是开了一个全局变量，用于存放程序运行的状态，伪代码如下
全局变量s
主函数(前端请求这个链接需要比较长的时间才能返回数据)：
s=0
''''
后台处理数据
''''
s=10
''''
后台处理数据
''''
如此重复
最后返回数据的时候s=100
辅助函数:
返回s的值
这是他的实现思路，就是通过全局变量给主函数插桩，告知辅助函数主函数运行到哪一步了
两个ajxa用的很巧妙，很简单的一个实现方法
它山之石可以攻玉
他的思路的问题是没有考虑到并发性，多用户下肯定是不能用同一个全局变量s的
我的一个思路
众所周知，每个用户都有一个独立的会话，那么就可以，把这个全局变量存在session里面，实现互相不干扰。
思路肯定没问题的，但是被ajax的机制坑了，ajax异步请求的时候session是不能在后台函数没有执行完成的时候更新的，这就导致辅助函数不能访问到没执行完成主函数的session的
我的第二个思路
那么session不行，我索性将全局变量改成一个map，前端两个ajax在访问后台的时候，带一个随机数过去，作为map的key，全局变量作为map的value，这样随机数的冲突是很小的，后台执行进度可以并发访问了
前端伪代码
ajax1：
异步访问主函数
传递一个随机数seed
等待数据返回并显示
杀死定时器
定时器：
ajax2：
异步访问辅助函数
传递一个随机数seed
拿到后台map中的全局变量
更改进度条显示为全局遍历的值
使用flask框架踩过的一些坑
首先要开启flask的多线程
不然后台是单线程的，前端异步访问，后台在处理主函数的时候根本无暇顾及辅助函数
app.run(debug=True, threaded=True)
前端的form表单，JavaScript处理完要之后要return false，不然JavaScript提交一次后台，html表单又提交一次。。。
前端form表单设置了pattern值之后，点击事件，先是JavaScript那里处理，然后才经过pattern，所以JavaScript也要正则匹配，成功就处理完return false，不成功就return true，给pattern处理，input标签自带前端提示
————————————————
版权声明：本文为CSDN博主「请叫我西木同学」的原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/qq965194745/article/details/80034993
前端如何实现后端运行进度_前端动态获取后台处理进度显示在进度条上相关推荐
- 前端如何实现后端运行进度_前端实时更新后端处理进度之 进度条实现
情景需求 在做图形提交界面时,点击提交按钮后,系统需要较长时间做处理,前端需要动态显示处理进度,并在完成后显示处理结果 实现逻辑 1.点击按钮后向后台发送数据处理请求2.后台处理数据3.前端获取后端处 ...
- python前端和后端的区别_前端和后端的区别
有的人认为,前端很好学,后端不好学. 也有的人认为,前端不好学,后端好学,归根到底还得看个人兴趣. 前端和后端做简单的叙述 后端:入门难,深入更难,枯燥乏味,没有太大成就感,看一堆业务逻辑代码. 前端 ...
- 前端和后端的英文_前端工程师一般都喜欢去哪些网站逛？
看到有人问前端开发应该知道哪些网站,那我就来总结一下. 我先说一些程序员很通用的网站,再推荐一写前端程序员可以订阅的优质前端内容网站,如果对你有用,就点个赞呗~ 1. Google: 这个不用多说了吧 ...
- 前端和后端的英文_前端、后端、全栈是什么意思？薪资怎么样？
随着互联网行业的飞速发展,对专业的IT技能人才的需求量也随之变大. 据统计,未来五年,我国互联网人才需求量还会持续增长,预计需求量达到1500万-2000万,以软件开发为例,我国软件开发人才每年都在增 ...
- 前端还是java哪个更累_前端开发和后端开发的区别？这两者哪个更累？
前端开发和后端开发的区别有哪些?前端开发和后端开发哪个做起来更累?对于刚接触开发的朋友可能会有这样的疑问,下面就一起来了解下吧! 1.前端开发: 网站的"前端"是与用户直接交互的部 ...
- python前端开发和后端开发工程师_一文看懂前端和后端开发
作为一名开发者,你可能会想:2019 年最好的软件开发技术和编程语言会是什么?它们又是如何被应用在软件开发当中的?如果你在思考这个问题,那就来对地方了.这篇文章将对前端和后端开发技术做一个对比,先从基 ...
- 前端和后端的英文_前端真的没有后端工资高？
不管是小程序的横空出世,还是Web应用的大量涌现,它们都掀起了一波"前端开发需求热",给前端开发工程师们带来了春天.几乎整个互联网行业都缺前端工程师,无论是刚起步的创业公司,还是上 ...
- 前端面试技巧和注意事项_前端面试百分之九十九过的技巧
2020最全的前端面试指南,一个多月 1.8w 字的面试经验积累,凭借它最终成功入职大厂-- 今年的金三银四刚好赶上疫情,很多大公司都停止招聘甚至裁员,想跳槽的小伙伴被打的措手不及. 需求减少要求肯定 ...
- 前端面试技巧和注意事项_前端HR的面试套路，你懂几个？
原标题:前端HR的面试套路,你懂几个? 面试前端工程师对我来说是一件非常有意思的事,因为面试过程很大程度上也是自我提升的过程.经过这几年在行业里的摸索,我总结出了自己的一套很有效的面试前端工程师的方法 ...
最新文章
- java运行环境jdk的安装和环境变量的配置教程
- JavaScript之js的一些基础方法
- centos 一键安装ftp 配置_CentOS快速搭建FTP(初级-四步)
- 【大型网站技术实践】初级篇：搭建MySQL主从复制经典架构
- 重磅！微软发布 vscode.dev，把 VSCode 带入浏览器！
- Xcode7常见问题汇总
- Z.ExtensionMethods 一个强大的开源扩展库
- JedisConnectionException: java.Net.SocketTimeoutException: Read timed
- 在C++中用虚函数的作用是什么？为什么要用到虚函数
- linux 重启oracle实例_Oracle实战(二)-Oracle概述
- 曼秀雷敦搜索引擎营销方案_搜索引擎营销——被严重低估的互联网营销途径
- pyspark报错问题 Exception in thread main java.lang.UnsupportedClassVersionError 成功解决
- 2021-09-23图嵌入方法
- ZXPInstaller for mac(zxp文件安装器)免费版
- Northwind数据库下载地址
- git pull报错 Can‘t update no tracked branch
- 【vulhub漏洞复现】ActiveMQ 反序列化漏洞 (CVE-2015-5254)-01
- 电脑通过wifi连接手机（adb移动设备连接电脑）
- 资源文件冲突error RC2151 : cannot reuse string constants, 61446(0xF006)
- 词根词缀prim/prehend/pri/psych等延伸词汇