后台任务完成后如何刷新首页答案

【问题标题】：How to refresh front page after back-end task completed后台任务完成后如何刷新首页
【发布时间】：2019-04-21 00:09:05
【问题描述】：

我正在用python flask设计一个web应用程序，处理流程是这样的：

用户选择一个指定的URL，并要求服务器站点做一些耗时的任务；
耗时任务随后在新线程中运行；
#2 完成后，服务器会更新一些有关 URL 的信息，我需要刷新 #1 中的页面

我不知道如何将“完成”状态通知给前端以刷新页面。

谁能帮帮我？谢谢

【问题讨论】：

标签： python flask-bootstrap

【解决方案1】：

使用flask-socketio 可能会满足您的要求。它在前端和后端之间建立连接，让后端发出消息，前端注册一个回调，当它收到事件时触发。

$ pip install flask-socketio

app.py

import json
import time

from flask import Flask, render_template
from flask_socketio import SocketIO, emit

app = Flask(__name__)
app.config['SECRET_KEY'] = 'secret!'
socketio = SocketIO(app)


@app.route('/')
def hello(name=None):
    return render_template('index.html')


@socketio.on('long-running-event')
def handle_my_custom_event(input_json):
    time.sleep(5)
    emit('processing-finished', json.dumps({'data': 'finished processing!'}))


if __name__ == '__main__':
    socketio.run(app)

模板/index.html

<html>
<body>
<button id="long-running-operation">Process data</button>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/socket.io/1.3.6/socket.io.min.js"></script>
<script type="text/javascript" charset="utf-8">
    var socket = io.connect('http://' + document.domain + ':' + location.port);

    let button = document.getElementById('long-running-operation');

    button.addEventListener('click', () => {
      socket.emit('long-running-event', {data: 'process data'});
    });

    socket.on('processing-finished', function (data) {
      alert(JSON.parse(data).data)
    });

</script>
</body>
</html>

然后使用python app.py 运行应用程序。在浏览器中访问应用程序http://127.0.0.1:5000/，然后单击按钮。该按钮会将'long-running-event' 请求发送到flask，flask 会通过休眠5 秒来模拟长时间运行的进程来处理它。然后，flask 发出 'processing-finished 消息，javascript 触发注册的回调，通过提醒 flask 发送的消息来监听该事件。

【讨论】：

其他函数可以调用这个句柄_my_custom_event吗？
你可能已经有了一个函数来启动这个耗时的任务。我想你可以只调用那个函数而不是调用time.sleep。
我按照你的示例代码，但是当点击按钮时，什么也没有发生，没有错误，没有警告，没有消息......
在此示例中，单击按钮后，大约 5 秒钟内不会发生任何事情，然后会弹出警报。您是否检查了烧瓶终端输出和浏览器控制台中的错误？
我找到了错误，并通过添加：