EventSource（又称为 Server-Sent Events，SSE）是一种在 Web 应用程序中实现服务器推送（服务器向客户端推送实时数据）的技术。是 HTML5 的一部分，实现了服务器向客户端推送数据，而不需要客户端不断地轮询服务器以获取最新数据。相较于 WebSocket 这样的全双工通信协议，EventSource 设计更为简单，特别适用于仅需服务器向客户端推送数据的场景，比如实时消息通知、股票报价更新、社交软件的新消息提示等。
文章持续更新中，微信搜索【路多辛】阅读更多优质文章
什么是 EventSource
EventSource 是 HTML5 中引入的一项技术，定义了一种从服务器到客户端的单向数据传输机制。EventSource 的核心思想是实现服务器端主动推送数据到客户端，而无需客户端频繁发起请求。基于 HTTP 长轮询技术，但与传统的轮询相比，具有更高的效率和实时性，因为一旦连接建立，服务器可以连续发送多个事件到客户端，直到连接关闭。
EventSource 工作原理
EventSource 基于 HTTP 协议，但与传统的 HTTP 请求不同，EventSource 创建了一个持久的连接，这个连接会一直保持打开状态，直到被客户端或服务器明确关闭。服务器可以通过这个连接随时发送新的数据。
- 建立连接：客户端通过 JavaScript 创建一个 EventSource 对象，指定要连接的服务器端点（URL）。通常是一个特殊的后端处理程序，负责生成并发送实时数据流。例如：
var source = new EventSource('http://example.com/events');这个 source 对象会向指定的 URL 发送一个 HTTP GET 请求。服务器响应这个请求，并保持连接打开，以便发送后续的数据更新。
- 数据传输：服务器响应这个请求，并保持连接打开状态，而不是像普通 HTTP 请求那样发送完响应就关闭连接，响应需要设置为 text/event-stream 类型。之后，服务器可以随时发送数据到客户端，以两个换行符结尾，客户端的 EventSource 对象会接收到这个数据块作为一个事件。一个典型的服务器发送的事件可能是这样的：
data: This is a message\n\n客户端的 EventSource 对象在收到这个数据块后，会触发一个 message 事件。
- 事件处理：客户端接收到事件后，EventSource 对象会触发相应的事件处理器（如 onmessage, onopen, onerror），开发者可以通过这些处理器处理接收到的数据。例如：
source.onmessage = function(event) {
console.log("New message:", event.data);
};服务器还可以发送命名的事件，客户端可以监听这些特定的事件：
event: userconnect
data: {"username": "Alice"}在客户端，可以这样监听这个命名事件：
source.addEventListener('userconnect', function(event) {
var data = JSON.parse(event.data);
console.log(data.username + " connected");
});- 断线重连：如果连接意外中断，EventSource 对象会自动尝试重新建立连接，除非明确被关闭或者达到最大重试次数。默认情况下，重连会在断开连接后立即发生。如果服务器想要通知客户端在一段时间后重连，可以包含一个 retry 字段：
retry: 10000\n
data: Please wait 10 seconds before reconnecting\n\n告诉客户端在10秒后尝试重新连接。
EventSource 的优势
- 简单轻量：EventSource 的实现和 API 都非常简单，对服务器压力小，不需要复杂的握手过程，易于理解和使用。
- 自动重连：提供内置的断线重连机制，提高可靠性。
- 易于部署：基于标准的 HTTP 协议，无需更改服务器配置即可使用。
- 单向通讯：适合于只需要服务器推送数据的应用场景，简化了客户端逻辑。
EventSource 的局限性
- 不支持二进制数据：只能发送文本数据。
- 单向通信：只能从服务器到客户端发送数据，不能从客户端向服务器发送。
EventSource 的使用场景
- 实时通知：比如社交媒体的实时更新、新闻网站的实时报道等。
- 股票或货币行情更新：金融应用中的实时价格更新。
- 在线聊天应用：虽然是单向的，但可以结合其他技术实现双向通信。
- 游戏状态更新：在在线游戏中推送游戏状态的更新。
示例代码
客户端代码（html+js）：
EventSource Example
Server-sent Events Example
服务端代码（Golang）：
package main
import (
"fmt"
"log"
"net/http"
"time"
)
func main() {
http.HandleFunc("/events", eventsHandler)
log.Println("Server started on :8080")
if err := http.ListenAndServe(":8080", nil); err != nil {
log.Fatal("ListenAndServe:", err)
}
}
func eventsHandler(w http.ResponseWriter, r *http.Request) {
// 设置响应头
w.Header().Set("Content-Type", "text/event-stream")
w.Header().Set("Cache-Control", "no-cache")
w.Header().Set("Connection", "keep-alive")
w.Header().Set("Access-Control-Allow-Origin", "*")
// 发送事件数据
for {
timeMsg := fmt.Sprintf("data: The server time is %v\n\n", time.Now())
w.Write([]byte(timeMsg))
flusher, ok := w.(http.Flusher)
if !ok {
log.Println("Streaming unsupported!")
return
}
flusher.Flush()
time.Sleep(1 * time.Second)
}
}小结
EventSource 是一个强大又简单的 API，为开发者提供了一种在 Web 应用中实现服务器到客户端的实时通信的方法。尽管有很多局限性，但在适当的场景下是一个非常有用的工具。
文章持续更新中，微信搜索【路多辛】阅读更多优质文章