服务器发送事件 Server-Sent Events

导读

服务器发送事件 (SSE) 是一种服务器推送技术，使客户端能够通过 HTTP 连接从服务器接收自动更新。每个通知都以文本块的形式发送，以一对换行符结尾（了解更多信息 此处)。

用法

要在路由（在 控制器类 内注册的路由）上启用服务器发送事件，请使用 @Sse() 装饰器注释方法处理程序。

ts
@Sse('sse')
sse(): Observable<MessageEvent> {
  return interval(1000).pipe(map((_) => ({ data: { hello: 'world' } })));
}
提示

@Sse() 装饰器和 MessageEvent 接口从 @nestjs/common 导入，而 Observable、interval 和 map 则从 rxjs 包导入。

警告

Server-Sent Events 路由必须返回 Observable 流。

在上面的示例中，我们定义了一个名为 sse 的路由，该路由允许我们传播实时更新。可以使用 EventSource API 监听这些事件。

sse 方法返回一个发出多个 MessageEvent 的 Observable（在此示例中，它每秒发出一个新的 MessageEvent）。MessageEvent 对象应遵循以下接口以符合规范：

ts
export interface MessageEvent {
  data: string | object
  id?: string
  type?: string
  retry?: number
}

有了这个，我们现在可以在客户端应用程序中创建 EventSource 类的实例，并将 /sse 路由（与我们传递到上面的 @Sse() 装饰器的端点匹配）作为构造函数参数传递。

EventSource 实例打开与 HTTP 服务器的持久连接，该服务器以 text/event-stream 格式发送事件。连接保持打开状态，直到通过调用 EventSource.close() 关闭。

打开连接后，来自服务器的传入消息将以事件的形式传递到您的代码。如果传入消息中有事件字段，则触发的事件与事件字段值相同。如果没有事件字段，则会触发通用 message 事件 (source)。

js
const eventSource = new EventSource('/sse')
eventSource.onmessage = ({ data }) => {
  console.log('New message', JSON.parse(data))
}

Example

这里 提供了一个可用的示例。