什么是 Server-sent Events?
Server-sent Events（简称SSE）是一种用于实现服务器向客户端推送事件的技术。SSE 可以让服务器主动向客户端推送新的数据，而不需要客户端请求。这种技术通常用于实现实时通信、即时更新等功能。
SSE 是基于 HTTP 协议的，使用简单，支持跨域请求，兼容性好，不需要额外的插件或框架支持。
SSE 的使用场景
实时信息推送
SSE 可以用于实现实时信息推送，例如在线聊天、股票行情等。服务器可以向客户端推送新的消息，不需要客户端轮询或者长轮询，可以减少服务器的负载和网络带宽的消耗。
实时更新
SSE 可以用于实现实时更新，例如在线编辑器、博客评论等。服务器可以向客户端推送新的更新，客户端可以及时地更新显示内容，不需要用户手动刷新页面。
事件通知
SSE 可以用于实现事件通知，例如新闻订阅、邮件提醒等。服务器可以向客户端推送新的事件通知，客户端可以及时地响应和处理。
SSE 的使用方法
服务端代码示例
在服务端，我们可以使用 Node.js 的 EventSource 类来实现 SSE。具体代码如下所示：
-- -------------------- ---- -------
----- ---- - ----------------
----------------------- ---- -- -
------------------ -
--------------- --------------------
---------------- -----------
------------- ------------
---
-------------- -- -
---------------- - - --- -------------------- - --------
-- ------
----------------上述代码中，我们创建了一个 HTTP 服务器，并设置响应头的 Content-Type 为 text/event-stream，这是 SSE 的标志。然后使用 setInterval 定时向客户端发送数据，数据格式为 "data: 数据内容\n\n"，其中 \n\n 是必须的，表示数据结束。
客户端代码示例
在客户端，我们可以使用 JavaScript 来实现 SSE。具体代码如下所示：
const source = new EventSource('/sse');
source.onmessage = (event) => {
console.log(event.data);
};上述代码中，我们创建了一个 EventSource 对象，并指定了服务器的地址。然后使用 onmessage 事件监听服务器推送的消息，当有新的消息时，就会触发该事件，并打印消息内容。
SSE 的注意事项
浏览器兼容性
SSE 是 HTML5 标准的一部分，但并不是所有浏览器都支持 SSE。目前，主流的浏览器都支持 SSE，但是 IE 浏览器的支持程度较低。
重连机制
SSE 的连接是长连接，如果连接中断，客户端需要重新连接服务器。为了实现重连机制，我们可以在客户端代码中使用 onerror 事件来监听连接错误，并重新连接服务器。
服务器负载
SSE 的长连接会占用服务器的资源，因此需要注意服务器的负载情况。可以使用定时器来控制服务器向客户端发送数据的频率，或者使用更高级的技术，例如 WebSocket。
总结
Server-sent Events（SSE）是一种用于实现服务器向客户端推送事件的技术。SSE 可以用于实现实时信息推送、实时更新、事件通知等功能。SSE 使用简单，支持跨域请求，兼容性好，不需要额外的插件或框架支持。但是需要注意浏览器兼容性、重连机制和服务器负载等问题。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65e29c2b1886fbafa4f437cc