Server-sent Events（SSE）是一种服务器向客户端推送流数据的技术。SSE 不同于 WebSocket，它只支持单向数据流，而且只使用 HTTP 协议。SSE 十分适合用于实时通知和流数据，例如股票报价、实时新闻等。
在 Node.js 中，我们可以使用 sse 模块来简化 Server-sent Events 的实现。下面我们将详细介绍如何通过 Node.js 使用 Server-sent Events 更新数据。
安装 sse 模块
首先，我们需要安装 sse 模块，可以使用 npm 命令进行安装：
--- ------- ---
创建 Server-sent Events 服务
我们可以使用 Node.js 内置的 http 模块来创建一个 Server-sent Events 服务。先看下面的代码：
----- ---- - ----------------
----- --- - ---------------
----- ------ - ----------------------- ---- -- -
-- -------- --- ---------- -
----- ------ - -------- -----
------------- ----- ------ ------ ---
- ---- -
-------------- - ----
------------ --------
-
---
------------------- -- -- -
------------------- -- --------- -- ---- -------
---上面的代码创建了一个 http 服务器，并在 /events 路径下创建了一个 Server-sent Events 服务。当浏览器请求 /events 路径时，会返回 SSE 数据。
发送 SSE 数据
服务器向客户端发送 SSE 数据的方式有以下两种：
send 方法
send 方法是 sse 模块提供的发送 SSE 数据的方式。下面的代码演示了如何使用 send 方法向客户端发送 SSE 数据：
----- ------ - -------- ----- ------------- ----- ------ ------ ---
调用 send 方法时，可以传入一个对象，包括以下属性：
data：SSE 数据的消息体。event：SSE 数据的事件名。id：SSE 数据的 ID。retry：SSE 数据发送失败后需要等待多久再次发送。
write 方法
在 SSE 数据较为复杂时，可以使用 write 方法逐个字段地将 SSE 数据写入响应对象中。下面的代码演示了如何使用 write 方法向客户端发送 SSE 数据：
----- ------ - -------- ----- ---------------- ----- ------------
在 write 方法中，需要按照以下格式写入 SSE 数据：
data:：SSE 数据的属性名。hello world：SSE 数据的值。\n\n：每个 SSE 数据之间需要两个换行符。\n 代表回车换行
接收 SSE 数据
一旦浏览器和服务器建立了 SSE 连接，浏览器就可以接收从服务器发来的 SSE 数据。下面的代码演示了如何在浏览器中接收 SSE 数据：
----- ----------- - --- ----------------------- --------------------- - --- -- - -------------------- --
上面的代码创建了一个 EventSource 对象，用于接收从服务器发来的 SSE 数据。在 onmessage 回调函数中，可以使用 e.data 获取 SSE 数据的消息体。
实现 Server-sent Events 计数器示例
我们可以通过 Server-sent Events 实现一个简单的计数器，每秒钟向客户端发送一个递增的数字。
----- ---- - ----------------
----- --- - ---------------
----- ------ - ----------------------- ---- -- -
-- -------- --- ----------- -
----- ------ - -------- -----
--- ------- - --
-------------- -- -
------------- ----- --------- ---
-- ------
- ---- -
-------------- - ----
------------ --------
-
---
------------------- -- -- -
------------------- -- --------- -- ---- -------
---在浏览器中访问 /counter 路径，即可看到逐个递增的数字。
----- ----------- - --- ------------------------ --------------------- - --- -- - -------------------- --
总结
本文介绍了如何通过 Node.js 使用 Server-sent Events 更新数据。我们使用了 sse 模块来创建了一个简单的 SSE 服务，并演示了如何向客户端发送 SSE 数据和如何接收 SSE 数据。我们还实现了一个简单的计数器示例，展示了 SSE 在浏览器实时更新数据的功能。
SSE 可以很好地解决实时通知和流数据的需求，但它只支持单向数据流。如果需要双向通信，可以考虑使用 WebSocket。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/645ef67a968c7c53b01186c3