时间戳

首页 > 解决方案 > Flask/Python - 如何使用运行进度更新进度条

javascript - Flask/Python - 如何使用运行进度更新进度条

问题描述

我有一个需要一些时间的过程，我想在等待屏幕上显示一个进度条，进度条在进度期间更新，直到完成，然后转到下一页。我有以下代码：

我有一个呈现等待屏幕的部分：

@app.route('/waiting_screen', methods=['POST','GET'])
def waiting():
    return render_template("waiting_screen.html")

以及处理处理的部分：

@app.route('/process',methods=['POST', 'GET'])
def process():
    file = df
    # Fill database
    for row in df:
        print(row)
    return render_template('finished_process.html')

我的 waiting_screen html 文件如下所示：

{% block content %}
<div method="POST">
    <h4 style="text-align:center"> Busy processing... </h4>
    <br>
    <head>
        <div id="loader"></div>
        <div style="display:none;" id="myDiv" class="animate-bottom" >
        </div >
        <script>
        var myVar;
        function myFunction() {
        myVar = setTimeout(showPage, 3000);
        }

        function showPage() {
        document.getElementById("myDiv").style.display = "block";
        }
        document.addEventListener("DOMContentLoaded", function(event) {
            waitForMe().then(() => {
                window.location.href = "/process";
            });
        });
        </script>
    </head>
</div>
{% endblock %}

这个页面给了我一个等待的动画，但是因为这个过程需要很长时间，我真的需要一个进程栏。

我已经尝试过按下按钮并运行进度条的示例，但我注意到我没有经验来了解我的 Python 函数和我的 HTML 页面中的脚本如何通信，所以我无法将它们连接起来.

标签： javascriptpythonjqueryflaskprogress-bar

解决方案

首先，您现在是否能够从正在运行的后台任务中提取百分比？

如果你是，我认为你应该使用像Flask-SocketIO这样的东西，它可以让你的服务器轻松地“实时”地与你的前端通信。这样，您可以例如每秒发送一次状态更新。在您的前端，您将监听此事件并相应地更新进度条。

推荐阅读