什么是 SSE？
SSE（Server-Sent Events），简称服务器推送事件，是一种基于 HTTP 的服务器推送技术。SSE 可以让浏览器自动接收来自服务器的更新事件，从而实现实时更新页面内容，类似于 WebSocket，但又有着明显的不同之处。
SSE 能做什么？
SSE 通常用于实时推送消息、通知、提醒等，适用于需要实现高实时性的应用场景，如在线聊天室、股票行情、天气预报等。
如何使用 SSE？
在服务端可以使用类似于下面这样的代码来实现 SSE：
-- -------------------- ---- -------
----- ------- - -------------------
----- --- - ----------
------------------ ------------- ---- -
------------------ -
--------------- --------------------
---------------- -----------
------------- ------------
---
---------------------- -
----- ---- - ------ ----- -------------
----------------
-- ------
---在客户端可以使用以下代码来消费 SSE：
const eventSource = new EventSource('/stream');
eventSource.addEventListener('message', function(event) {
console.log(event.data);
});如何解决跨域访问问题？
由于 SSE 基于 HTTP 协议，因此难免会遇到跨域问题。在 SSE 中，可以通过指定 CORS 头来解决跨域问题。服务端代码示例：
-- -------------------- ---- ------- ----- ------- - ------------------- ----- ---- - ---------------- ----- --- - ---------- ----- ----------- - - ------- ---- -------- ------ --------------- -------------- -- ---------------------- ------------------- ------------------ ------------------ ------------- ---- - -- --- ---
如何进行性能优化？
SSE 的推送过程是基于长连接的，因此可能会存在连接和性能问题。以下是一些性能优化建议：
- 控制后端发送的频率，避免过于频繁。
- 合并消息，避免频繁发送短小的消息，提高传输效率。
- 及时清理无效连接，避免长时间占用资源，影响整体性能。
总结
SSE 是一种基于 HTTP 的推送技术，在实时推送消息、通知等场景中具有广泛应用。使用 SSE 可以解决 WebSocket 中存在的一些问题，同时也可以避免一些不必要的开销。在使用 SSE 时，需要了解跨域访问问题、性能优化等相关知识，才能充分发挥 SSE 的优势。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64a1083a48841e9894d4dd48
