使用 ASP.NET Core 和 SignalR 实现 Server-Sent Events-JavaScript中文网-JavaScript教程资源分享门户

Server-Sent Events (SSE) 是一种在 Web 应用程序中实现服务器向客户端推送事件的技术。使用 SSE 技术，可以通过简单的 HTTP 连接实时向客户端发送事件和消息。本文将介绍如何使用 ASP.NET Core 和 SignalR 实现 SSE。

SignalR 简介

SignalR 是一个开源的 ASP.NET Core 库，用于在 Web 应用程序中实现实时通信功能。它使得我们可以轻松地在客户端和服务器之间建立一个持久连接，并通过该连接发送消息和数据。SignalR 并不是 SSE 的唯一实现方式，但是它是目前最为流行和成熟的 SSE 实现方式之一。

实现 SSE

首先，我们需要在 ASP.NET Core 项目中安装 SignalR 库。打开命令行窗口，切换到项目目录，然后执行以下命令：

dotnet add package Microsoft.AspNetCore.SignalR

安装完成后，我们需要添加 SignalR 中间件到应用程序的 Startup.cs 文件中：

// javascriptcn.com 代码示例
public void ConfigureServices(IServiceCollection services)
{
    services.AddSignalR();
    // ...
}

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
    app.UseRouting();
    app.UseEndpoints(endpoints =>
    {
        endpoints.MapHub<EventStream>("/events");
        // ...
    });
}

上面的代码中，我们首先使用 AddSignalR() 方法将 SignalR 服务添加到 DI 容器中，然后添加 /events 路由，该路由将被用于 SSE 的事件流。

接下来，我们需要实现 SSE 事件流。为此，我们可以创建一个继承自 SignalR Hub 的类，例如：

public class EventStream : Hub
{
    public async Task SendEvent(string eventName, string eventData)
    {
        await Clients.All.SendAsync(eventName, eventData);
    }
}

上面的代码中，我们创建了一个名为 EventStream 的 Hub 类，并添加了一个方法 SendEvent，该方法用于向所有客户端发送事件。

我们可以在控制器中使用该 Hub 类来发送事件。例如：

// javascriptcn.com 代码示例
public class HomeController : Controller
{
    private readonly IHubContext<EventStream> _eventStream;

    public HomeController(IHubContext<EventStream> eventStream)
    {
        _eventStream = eventStream;
    }

    public IActionResult Index()
    {
        return View();
    }

    public async Task<IActionResult> SendEvent(string eventName, string eventData)
    {
        await _eventStream.Clients.All.SendAsync(eventName, eventData);
        return Ok();
    }
}

上面的代码中，我们首先注入了 EventStream 类的 IHubContext 对象，然后在 SendEvent 方法中使用该对象向所有客户端发送事件。

最后，我们需要在客户端中订阅事件流。我们可以使用 JavaScript 创建一个 EventSource 对象，例如：

var eventSource = new EventSource('/events');

eventSource.addEventListener('myEvent', function(event) {
  console.log('Received event: ' + JSON.parse(event.data));
});

上面的代码中，我们首先创建了一个 EventSource 对象，并将 SSE 事件流的 URL 设置为 /events。然后，我们使用 addEventListener 方法订阅了一个名为 myEvent 的事件。

总结

在本文中，我们介绍了使用 ASP.NET Core 和 SignalR 实现 SSE 的方法。除了 SignalR 之外，还有其他 SSE 实现方式，例如使用 Node.js 和 Express，使用 Flask，使用 Go 等等。可以根据实际需求选择合适的工具和技术。

来源：JavaScript中文网，转载请注明来源本文地址：https://www.javascriptcn.com/post/653ad00a7d4982a6eb51822f