Jorgen's blog Jorgen's blog
首页
  • 平台架构
  • 混合式开发记录
  • 推送服务
  • 数据分析
  • 实时调度
  • 架构思想

    • 分布式
  • 编程框架工具

    • 编程语言
    • 框架
    • 开发工具
  • 数据存储与处理

    • 数据库
    • 大数据
  • 消息、缓存与搜索

    • 消息队列
    • 搜索与日志分析
  • 前端与跨端开发

    • 前端技术
    • Android
  • 系统与运维

    • 操作系统
    • 容器化与 DevOps
  • 物联网与安全

    • 通信协议
    • 安全
    • 云平台
newland
  • 关于我
  • 终身学习
  • 关于时间的感悟
  • 分类
  • 标签
  • 归档
GitHub (opens new window)

jorgen

Love it, make mistakes, learn, keep grinding.
首页
  • 平台架构
  • 混合式开发记录
  • 推送服务
  • 数据分析
  • 实时调度
  • 架构思想

    • 分布式
  • 编程框架工具

    • 编程语言
    • 框架
    • 开发工具
  • 数据存储与处理

    • 数据库
    • 大数据
  • 消息、缓存与搜索

    • 消息队列
    • 搜索与日志分析
  • 前端与跨端开发

    • 前端技术
    • Android
  • 系统与运维

    • 操作系统
    • 容器化与 DevOps
  • 物联网与安全

    • 通信协议
    • 安全
    • 云平台
newland
  • 关于我
  • 终身学习
  • 关于时间的感悟
  • 分类
  • 标签
  • 归档
GitHub (opens new window)
  • MQTT
  • WebSocket:构建实时双向通信的桥梁
  • HTTP/2-加速Web通信的新时代
  • HTTP/2-加速现代Web通信的引擎
  • HTTP/2-加速现代Web通信的新协议
  • HTTP/2与HTTP/3:现代Web协议的性能革命
  • HTTP/HTTPS-Web通信的基石
  • HTTP/HTTPS-万维网通信的基石
  • HTTP/HTTPS - 万维网通信的基础协议
  • HTTP Server-Sent Events - 服务器推送的简单实现方式
  • RESTful API - 现代Web服务的基石
  • SSE-服务器推送事件的轻量级解决方案
  • SSE-构建服务器推送的实时数据流
  • Server-Sent Events (SSE) - 轻量级服务器推送技术
  • WebRTC-构建点对点实时通信的利器
  • gRPC-构建高性能RPC服务的利器
  • 实时通信协议对比:WebSocket vs SSE vs gRPC
  • 服务器发送事件(SSE)- 简单高效的实时通信方案
    • 前言
    • SSE是什么?
    • 与WebSocket的对比
    • SSE工作原理
    • 实战:使用SSE实现实时通知
      • 前端实现
      • 后端实现(Node.js示例)
    • SSE适用场景
    • 结语
  • 长轮询:在WebSocket时代之前实现实时通信的古老技艺
  • GraphQL-现代API查询语言的革命
  • QUIC协议:HTTP/3的新基石
  • API网关与服务网格-微服务架构的通信基石
  • WebSocket断线重连机制-构建健壮实时通信的关键
  • WebSocket安全:构建安全实时通信的关键考量
  • 消息队列-构建分布式系统的异步通信基石
  • WebSocket子协议-为实时通信定制应用层协议
  • Web通信协议全景图-从HTTP到WebTransport的选择指南
  • WebTransport-HTTP/3时代的下一代实时通信协议
  • 实时通信协议监控与故障排查-保障实时通信系统的稳定性
  • 移动端实时通信协议选择与优化指南
  • 实时通信协议的兼容性与降级策略-构建跨平台的健壮实时应用
  • protocol
Jorgen
2023-11-15
目录

服务器发送事件(SSE)- 简单高效的实时通信方案

# 前言

在实时通信领域,我们已经了解了WebSocket和MQTT这两种强大的协议。🏗️ 但你是否想过,有一种更轻量级的解决方案,它基于我们熟悉的HTTP协议,却能实现高效的服务器到客户端的数据推送?这就是今天的主角——服务器发送事件(SSE)。让我带你探索这个被低估的实时通信技术!🚀

# SSE是什么?

THEOREM

**服务器发送事件(Server-Sent Events, SSE)**是一种允许服务器向客户端推送实时更新的技术标准。它基于HTTP协议,使用单向通信(服务器→客户端),特别适合需要服务器主动推送数据的场景。

SSE的核心特点:

  • 基于HTTP(默认端口80/443)
  • 使用持久HTTP连接
  • 单向通信(仅服务器→客户端)
  • 自动重连机制
  • 文本消息格式(UTF-8)
  • 轻量级实现

# 与WebSocket的对比

特性 SSE WebSocket
协议 HTTP 自定义协议
双向通信 ❌ 仅单向 ✅ 双向
重连机制 ✅ 内置 ❌ 需手动实现
二进制支持 ❌ 仅文本 ✅ 支持二进制
复杂度 🟢 简单 🟡 中等
浏览器兼容性 🟢 广泛 🟡 需polyfill

💡 个人建议:如果你的场景只需要服务器→客户端的单向推送,SSE是比WebSocket更简单、更轻量的选择!

# SSE工作原理

SSE的工作流程如下:

  1. 客户端通过EventSourceAPI发起请求
  2. 服务器保持HTTP长连接
  3. 服务器以text/event-stream格式发送数据
  4. 客户端自动处理消息和重连

典型的SSE消息格式:

event: message  
data: 这是第一条消息
id: 123  

data: 这是第二条消息
id: 124
1
2
3
4
5
6

# 实战:使用SSE实现实时通知

# 前端实现

// 创建EventSource连接
const eventSource = new EventSource('/api/notifications');

// 监听消息
eventSource.onmessage = (event) => {
  const data = JSON.parse(event.data);
  console.log('收到新通知:', data);
};

// 监听特定事件类型
eventSource.addEventListener('newOrder', (event) => {
  console.log('新订单提醒:', event.data);
});

// 处理错误
eventSource.onerror = (err) => {
  console.error('SSE错误:', err);
  eventSource.close();
};
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

# 后端实现(Node.js示例)

const express = require('express');
const app = express();

app.get('/api/notifications', (req, res) => {
  res.setHeader('Content-Type', 'text/event-stream');
  res.setHeader('Cache-Control', 'no-cache');
  res.setHeader('Connection', 'keep-alive');

  // 模拟实时推送
  setInterval(() => {
    const data = {
      type: 'notification',
      message: `新消息 ${new Date().toLocaleTimeString()}`,
      id: Date.now()
    };
    
    res.write(`data: ${JSON.stringify(data)}\n\n`);
  }, 2000);
});

app.listen(3000, () => {
  console.log('SSE服务器运行在 http://localhost:3000');
});
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

# SSE适用场景

SSE在以下场景表现出色:

  1. 实时仪表盘:股票行情、系统监控
  2. 通知系统:消息推送、邮件提醒
  3. 新闻更新:实时新闻流
  4. 社交媒体:动态更新
  5. 在线协作:文档协作状态

# 结语

SSE虽然不如WebSocket灵活,但它以极低的实现成本和出色的浏览器兼容性,在单向实时通信领域占据着不可替代的位置。🤔 当你只需要服务器向客户端推送数据时,不妨考虑SSE这个优雅的解决方案!

🌟 总结:选择通信协议时,不要只追逐最强大的技术,而应根据实际需求选择最适合的工具。SSE正是这种"恰到好处"的解决方案——简单、高效、可靠!


"简单是最终的复杂" —— 达芬奇

#实时通信#SSE#HTTP
上次更新: 2026/01/28, 15:36:58
实时通信协议对比:WebSocket vs SSE vs gRPC
长轮询:在WebSocket时代之前实现实时通信的古老技艺

← 实时通信协议对比:WebSocket vs SSE vs gRPC 长轮询:在WebSocket时代之前实现实时通信的古老技艺→

最近更新
01
LLM
01-30
02
intro
01-30
03
intro
01-30
更多文章>
Theme by Vdoing | Copyright © 2019-2026 Jorgen | MIT License
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式