前言
实时通信在现代的 Web 应用中越来越流行，从即时聊天到实时数据更新，它为用户提供了更加流畅的体验。在这篇文章中，我们将介绍如何使用 Flask 和 Server-Sent Events 构建实时通信应用。
什么是 Server-Sent Events？
Server-Sent Events 是一种用于向客户端发送实时更新的 Web 技术。与 WebSockets 不同，它是基于 HTTP 的，不需要双方建立长连接，因此更加轻量级。服务器可以使用 Server-Sent Events 向客户端发送文本消息和事件消息。客户端可以通过 JavaScript 监听这些消息。
Flask
Flask 是一个 Python 的 Web 框架，它是轻量级的，灵活的，适用于小型 Web 应用程序。Flask 通过一个简单的应用程序结构和一个大量的扩展，使得 Web 开发变得简单易行。
安装
使用 Python 的 pip 工具，安装 Flask 和 Flask-SSE 扩展。
pip install Flask pip install Flask-SSE
实例
以下是一个实现了 Server-Sent Events 的 Flask 应用程序，它在服务器上随机生成一个数字，然后将其发送到客户端。客户端使用 JavaScript 监听消息并更新页面中的数据。
// javascriptcn.com code example
from flask import Flask, render_template
from flask_sse import sse
import random
import time
app = Flask(__name__)
app.config["REDIS_URL"] = "redis://localhost"
app.register_blueprint(sse, url_prefix='/stream')
@app.route('/')
def index():
return render_template('index.html')
@app.route('/generate')
def generate():
while True:
number = random.randint(1, 100)
sse.publish({"number": number}, type='notify')
time.sleep(1)
if __name__ == '__main__':
app.run(debug=True)在上面的代码中，我们首先创建了一个 Flask 应用程序，并注册了 Flask-SSE 扩展。然后我们定义了一个 / 路由，它渲染了一个 HTML 模板。
在 /generate 路由中，我们使用一个无限循环来随机生成数字并将其发布到客户端。我们使用 Flask-SSE 扩展的 publish 方法来发送一个包含数字的字典。我们还指定了消息类型 type='notify'，这是可选的，但是在有多个消息类型时是必须的。
最后，我们使用 Flask 的 run 方法来运行应用程序。
JavaScript 代码
客户端代码非常简单，我们只需要使用 EventSource API 来监听服务器发送的消息。
var source = new EventSource('/stream');
source.addEventListener('notify', function(event) {
var data = JSON.parse(event.data);
document.getElementById('number').textContent = data.number;
}, false);在上面的代码中，我们使用 JavaScript 的 EventSource API 创建了一个连接到 /stream 的事件源。然后我们通过 addEventListener 方法注册了一个名为 notify 的事件回调函数。每次服务器发送一个 notify 类型的消息，该回调函数会被触发，我们从消息中获取数字，并将其更新到页面上。
结论
在本文中，我们学习了如何使用 Flask 和 Server-Sent Events 构建实时通信应用。我们演示了如何创建一个发布实时消息的服务端，并使用 JavaScript 在客户端接收这些消息。Flask 和 Server-Sent Events 提供了一种有效且易于使用的方式来实现实时应用程序。
参考文献
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6735a02f0bc820c5824f8c02