Techniques
服务器发送事件
学习如何在 NestJS 中使用服务器发送事件(SSE)来实现实时数据推送,包括基本用法和客户端连接。
服务器发送事件
服务器发送事件(SSE)是一种服务器推送技术,使客户端能够通过 HTTP 连接从服务器接收自动更新。每个通知都作为一个由一对换行符终止的文本块发送(在这里了解更多)。
用法
要在路由上启用服务器发送事件(在控制器类中注册的路由),请使用 @Sse() 装饰器注释方法处理程序。
@Sse('sse')
sse(): Observable<MessageEvent> {
return interval(1000).pipe(map((_) => ({ data: { hello: 'world' } })));
}
提示 @Sse() 装饰器和 MessageEvent 接口从 @nestjs/common 导入,而 Observable、interval 和 map 从 rxjs 包导入。
警告 服务器发送事件路由必须返回一个 Observable 流。
在上面的示例中,我们定义了一个名为 sse 的路由,它将允许我们传播实时更新。这些事件可以使用 EventSource API 进行监听。
sse 方法返回一个发出多个 MessageEvent 的 Observable(在此示例中,它每秒发出一个新的 MessageEvent)。MessageEvent 对象应该遵循以下接口以匹配规范:
export interface MessageEvent {
data: string | object;
id?: string;
type?: string;
retry?: number;
}
有了这个设置,我们现在可以在客户端应用程序中创建 EventSource 类的实例,将 /sse 路由(与我们在上面的 @Sse() 装饰器中传递的端点匹配)作为构造函数参数传递。
EventSource 实例打开到 HTTP 服务器的持久连接,该服务器以 text/event-stream 格式发送事件。连接保持打开状态,直到通过调用 EventSource.close() 关闭。
一旦连接打开,来自服务器的传入消息以事件的形式传递给您的代码。如果传入消息中有事件字段,则触发的事件与事件字段值相同。如果没有事件字段,则触发通用的 message 事件(来源)。
const eventSource = new EventSource('/sse');
eventSource.onmessage = ({ data }) => {
console.log('New message', JSON.parse(data));
};
示例
一个工作示例可在这里获得。