Python实现半双工的实时通信SSE（Server-Sent Events）
1 简介
实现实时通信一般有WebSocket、Socket.IO和SSE（Server-Sent Events）三种方法。WebSocket和Socket.IO是全双工的实时双向通信技术，适合用于聊天和会话等，但相对于SSE比较笨重，SSE适合用于服务器主动向客户端实时推送数据，例如：用于大模型实时对话。
WebSocket是一种HTML5提供的全双工通信协议，它基于TCP在客户端和服务器之间建立持久性的连接，实现两者之间实时双向数据通信。
Socket.IO是一个封装了 Websocket 的实时双向数据通信库，它封装了自动重连、自动检测网络状况和自动跨浏览器兼容性等。
SSE（Server-Sent Events）是一种利用 HTTP 协议长连接特性，在服务器与客户端之间建立持久化连接，实现服务器主动向客户端推送数据的半双工实时数据通信技术，也被称为“事件流”（Event Stream）。
本文使用Python和Vue3实现SSE的实时通信，现在浏览器支持EventSource，不需要额外安装依赖包。
2 前端Vue3代码
<script setup lang="ts">
import { onBeforeUnmount} from 'vue'
defineProps<{ msg: string }>()
// 定义EventSource
let eventSource: any = null
// 建立连接
function createSseConnect(dataId: string) {
if (window.EventSource) {
// 创建连接
eventSource = new EventSource('http://127.0.0.1:5000/sse?data_id=' + dataId);
// 接收消息
eventSource.onmessage = (event: MessageEvent) => {
console.log("onmessage:" + dataId + ": " + event.data)
};
// // 也可以使用addEventListener实现自定义事件和默认message事件
// eventSource.addEventListener('message', (event: MessageEvent)=> {
// console.log("message" + dataId + ": " + event.data);
// }, false);
// 打开连接
eventSource.onopen = (event: Event) => {
console.log("onopen:" + dataId + ": " + event)
};
// 连接出错时
eventSource.onerror = (event: Event) => {
console.log("onerror :" + dataId + ": " + event)
};
} else {
console.log("浏览器不支持SSE")
}
}
// 组件销毁
onBeforeUnmount(() => {
// 关闭EventSource
if(eventSource != null){
eventSource.close()
}
})
</script>
<template>
<h1>{{ msg }}</h1>
<input type="button" value="发送消息" v-on:click="createSseConnect('1234')" />
</template>
<style scoped>
.read-the-docs {
color: #888;
}
</style>
3 后端Python代码
# 导入所需的模块
import json
import time
import datetime
from flask_cors import CORS
from flask import Flask, request, Response
app = Flask(__name__)
# 解决跨域问题
CORS(app, supports_credentials=True)
def get_data():
# 获取当前时间，并转换为 JSON 格式
dt_ms = datetime.datetime.now().strftime('%Y-%m-%d %H:%M:%S.%f')
return json.dumps({'time': dt_ms}, ensure_ascii=False)
@app.route('/sse')
def stream():
data_id = request.args.get('data_id')
print(data_id)
return Response(eventStream(), mimetype="text/event-stream")
def build_message(message: str, event="message"):
"""
构建消息
:param message: 数据消息
:param event: 事件，默认事件是“message”，可以根据自己的需求定制事件，对应前端的eventSource.addEventListener('message',()=>{}, false)中的message。
:return:
"""
head = "event:" + event + "\n" + "data:"
tail = "\n\n"
return head + message + tail
def eventStream():
id = 0
while True:
id += 1
# 睡眠
time.sleep(1)
str_out = build_message(get_data())
print(str_out)
# 构建迭代器
yield str_out
if __name__ == '__main__':
app.run(host='0.0.0.0', port=5000, debug=True)
4 执行结果
