当前位置：首页 > news >正文

对话的边界：HTTP 的克制，SSE 的流淌，WebSocket 的自由

news 2026/4/24 20:06:30

写在前面

“前后端交互，不就是前端调后端接口，后端返回 JSON 吗？”

这是大多数后端开发者的第一反应。我们习惯了 HTTP 请求-响应模式，却忽略了“数据交互”还有另外两种重要的方式。直到我接触 RAG 项目，需要实现“逐字输出”的效果时，才发现：原来 SSE（Server-Sent Events）可以让服务端像打字机一样把内容推给前端。

后来做直播间弹幕，又接触了 WebSocket：服务器能主动推送，客户端也能随时发消息，真正的“双向实时”。

这三种技术，就像三种不同的“对话方式”：

HTTP：你问一句，我答一句。问完结束。
SSE：你说开始，我就一直说，你只听不说。
WebSocket：咱们随时可以说，谁想说话就说，像打电话。

今天，我们就从原理到实战，彻底搞清这三者的区别、优缺点和适用场景。读完这篇，你不仅能对付面试官，还能在实际项目中做出更合理的技术选型。

一、HTTP：最熟悉的“一问一答”

1.1 工作原理

HTTP（HyperText Transfer Protocol）是建立在 TCP 之上的应用层协议，核心特征是请求-响应模型：

客户端（如浏览器）发起一个请求
服务端处理请求，返回响应
连接关闭（短连接），或保持一段时间（Keep-Alive）

1.2 实现方式（Java）

@RestController public class UserController { @GetMapping("/api/user") public User getUser() { return new User("张三", 18); } }

1.3 优缺点

1.4 适用场景

普通 CRUD 接口
RESTful API
文件上传/下载
不需要实时更新的页面（后台管理系统）

如果你需要“服务器主动发消息”或“实时双向通信”，HTTP 就不够用了。

二、SSE：服务端单向推送的“广播员”

SSE（Server-Sent Events）是 HTML5 规范的一部分，允许服务端通过 HTTP 协议单向向客户端推送事件流。客户端通过EventSourceAPI 接收。

你体验过的“AI 逐字输出”（ChatGPT 式打字效果），背后就是 SSE。

2.1 工作原理

客户端发起一个特殊的 HTTP 请求（Accept: text/event-stream）
服务端保持连接打开，并定期或按需发送data:格式的消息
客户端通过onmessage回调逐条接收，连接可以一直保持

2.2 实现方式（Java + Spring）

Spring 从 4.2 开始支持 SSE，使用SseEmitter：

@RestController public class SseController { @GetMapping(value = "/stream", produces = MediaType.TEXT_EVENT_STREAM_VALUE) public SseEmitter stream() { SseEmitter emitter = new SseEmitter(); // 异步线程推送 executor.execute(() -> { for (int i = 0; i < 10; i++) { emitter.send("消息 " + i); Thread.sleep(1000); } emitter.complete(); }); return emitter; } }

前端接收：

const eventSource = new EventSource('/stream'); eventSource.onmessage = (event) => { console.log('收到：', event.data); };

2.3 优缺点

2.4 适用场景

AI 流式对话（RAG、ChatGPT 式逐字输出）
实时股票行情、体育比分
服务器日志实时展示
新闻推送、系统通知

在 RAG 项目中用 SSE 做流式输出，正是最佳实践——既实现了实时感，又比 WebSocket 简单得多。

三、WebSocket：真正的全双工“电话线”

WebSocket 是一个独立的协议（ws:// / wss://），它在 HTTP 握手后升级为持久连接，实现了客户端和服务端之间任意时刻的双向通信。

3.1 工作原理

客户端发起 HTTP 请求，头部包含Upgrade: websocket
服务端同意升级，返回101 Switching Protocols
连接升级为 WebSocket 协议，之后双方可以随时互发消息

3.2 实现方式（Java + Spring WebSocket）

@Configuration @EnableWebSocketMessageBroker public class WebSocketConfig implements WebSocketMessageBrokerConfigurer { @Override public void registerStompEndpoints(StompEndpointRegistry registry) { registry.addEndpoint("/ws").withSockJS(); } @Override public void configureMessageBroker(MessageBrokerRegistry registry) { registry.enableSimpleBroker("/topic"); registry.setApplicationDestinationPrefixes("/app"); } }

前端（使用 STOMP 协议）：

const socket = new SockJS('/ws'); const stompClient = Stomp.over(socket); stompClient.connect({}, () => { stompClient.subscribe('/topic/room/123', (msg) => { console.log('弹幕：', msg.body); }); }); // 发送弹幕 stompClient.send('/app/chat', {}, JSON.stringify({content: '666'}));