应用错误收集

后端任务完成后如何刷新首页

时间：2018-11-18 12:39:22

标签： python flask-bootstrap

我正在设计一个带有python flask的Web应用程序，处理流程如下：

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

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

任何人都可以帮助我吗？谢谢

1 个答案:

答案 0 :(得分：2)

使用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)

templates / 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发送的消息来触发注册的回调以侦听该事件。