详解 HTML5 服务器发送事件(Server-Sent Events)
Server-Sent Events（SSE）提供了一种从服务器向客户端发送单向通信的机制。与 WebSockets 不同，SSE 使用标准的 HTTP 协议，并且非常简单易用。
以下是一个简单的 HTML5 服务器发送事件的例子：
<!DOCTYPE html>
<html>
<head>
<title>Server-Sent Events Example</title>
<script type="text/javascript">
if(typeof(EventSource)!=="undefined") {
// 检查浏览器是否支持 SSE
var source=new EventSource("/path/to/your/sse");
source.onmessage=function(event) {
// 处理服务器发送的消息
document.getElementById("result").innerHTML+=event.data + "<br>";
};
source.onerror=function(event) {
// 出现错误时的处理
console.error("EventSource failed.");
};
} else {
document.getElementById("result").innerHTML="Sorry, your browser does not support server-sent events...";
}
</script>
</head>
<body>
<div id="result"></div>
</body>
</html>服务器端代码示例（以 Python Flask 为例）：
from flask import Flask, Response
app = Flask(__name__)
@app.route('/path/to/your/sse')
def sse():
def event_stream():
while True:
yield 'data: This is a SSE message.\n\n'
yield 'data: Another SSE message.\n\n'
# 这里可以有更复杂的逻辑，比如从数据库读取数据
return Response(event_stream(), mimetype="text/event-stream")
if __name__ == '__main__':
app.run()在这个例子中，我们创建了一个简单的服务器发送事件流，客户端通过 JavaScript 的 EventSource 对象连接到这个流，并处理接收到的消息。服务器端每隔一段时间发送一条消息。这个例子展示了如何使用 SSE 实现服务器向客户端的单向通信。
评论已关闭