在 Web 开发中，服务端推送技术(Server-Sent Events, SSE) 是一种很有用的技术，它能够实现在服务端推送数据到客户端，使得客户端可以实时获取服务端的数据。这种技术在前端开发中的应用非常广泛，比如在线聊天、实时数据监控等等。
在 Node.js 中，SSE 技术也可以很方便地实现，本文将着重介绍 Node.js 中 SSE 技术的实现原理以及相关的使用方法和注意事项。
SSE 技术原理
SSE 技术是基于 HTTP 长连接的，换句话说，客户端通过在浏览器向服务端发送一个带有 Accept: text/event-stream 的 GET 请求，服务端在接收到请求之后会保持连接不断开，并且会持续地向客户端发送数据。这种方法相较于 WebSocket 技术而言更加轻量级，也更易于实现。
SSE 技术在服务端通过设置 HTTP 响应头，返回一个包含多条事件的数据流。每条事件包含一个事件名和一个数据字段，事件名默认是 message，可以通过 event 字段来修改事件名。服务端也可以通过发送一个 ping 事件作为保持连接的机制。
客户端通过浏览器原生的 EventSource API（一种特殊的构造函数），来接收服务端发送的数据。在客户端接收到事件的时候，可以通过调用 EventSource 实例的 addEventListener 方法来监听事件，并指定回调函数来处理数据。
Node.js 中 SSE 技术实现
在 Node.js 中，我们可以使用 http 模块来创建一个 HTTP 服务，并在其中实现 SSE 技术。
下面是一段使用 Express 框架的示例代码：
// javascriptcn.com 代码示例
const express = require('express')
const app = express()
app.get('/events', function(req, res) {
res.writeHead(200, {
'Content-Type': 'text/event-stream',
'Cache-Control': 'no-cache',
'Connection': 'keep-alive'
})
const timer = setInterval(function() {
const data = `data: ${new Date().toISOString()}\n\n`
res.write(data)
}, 1000)
req.on('close', function() {
clearInterval(timer)
})
})
app.listen(3000)上面代码中，我们使用 express 框架创建了一个 /events 路由，当客户端向该路由发送一个 GET 请求时，服务端就会返回一个 SSE 数据流。在响应头里面需要设置以下字段：
Content-Type：设置为text/event-stream，指定响应数据类型为 SSE 数据流。Cache-Control：设置为no-cache，禁止浏览器缓存数据。Connection：设置为keep-alive，保持连接不中断。
然后我们使用 setInterval 函数每隔 1 秒向客户端发送一条数据，这里只是一个时间字符串，实际上可以根据代码逻辑来发送具体的数据。
注意：这里的数据需要以 \n\n 结尾，这是 SSE 规定的格式，表示一条完整的事件结束。不要忘了在 write 函数中加上这个格式化符号。
同时，我们还需要监听客户端的 close 事件，当客户端主动断开连接时清除定时器，避免浪费服务器资源。
SSE 技术的应用
SSE 技术在前端中的应用非常广泛，下面介绍几个常见的应用场景：
- 实时数据和状态监控：比如在线聊天、网络游戏的玩家状态、在线地图的实时交通状态等等。
- 长时间任务进度监控：比如文件上传、数据导出等需要耗费一定时间的任务，可以通过 SSE 在服务端实时更新任务进度并推送到客户端。
- 定向推送：可以根据客户端的订阅信息，实现定向推送的功能。比如客户端可以在连接时发送订阅信息，服务端可以根据订阅信息向特定的客户端发送数据。
总结
本文介绍了 SSE 技术在 Node.js 中的实现原理，并给出了使用 Express 框架实现 SSE 的示例代码。同时，我们也了解了 SSE 技术在前端中的常见应用场景，希望本文能对读者加深对 SSE 技术的认识，并能在实际项目中得到应用。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/653f162d7d4982a6eb89b8d9