DEV Community

Aayush
Aayush

Posted on

5

Using server sent events in ASP.NET

I am assuming you already have your ASP.NET project ready, I will just straight into implementing SSEs for sending realtime updates to client.

1. Create a Controller for sending SSEs.

public class EventsController : ControllerBase
    {
        private static readonly List<StreamWriter> _clients = [];

        [HttpGet]
        public async Task Subscribe()
        {
            Response.Headers.Append("Content-Type", "text/event-stream");
            Response.Headers.Append("Cache-Control", "no-cache");
            Response.Headers.Append("Connection", "keep-alive");

            var streamWriter = new StreamWriter(Response.Body);
            _clients.Add(streamWriter);

            try
            {
                while (!HttpContext.RequestAborted.IsCancellationRequested)
                {
                    await Task.Delay(TimeSpan.FromSeconds(1), HttpContext.RequestAborted);
                }
            }
            finally
            {
                _clients.Remove(streamWriter);
            }
        }

        public static async Task NotifyClients(string data)
        {
            List<StreamWriter> deadClients = [];

            foreach (var client in _clients)
            {
                try
                {
                    await client.WriteAsync($"data: {data}\n\n");
                    await client.FlushAsync();
                }
                catch
                {
                    deadClients.Add(client);
                }
            }

            foreach (var deadClient in deadClients)
            {
                _clients.Remove(deadClient);
            }
        }
    }
Enter fullscreen mode Exit fullscreen mode

2. Use the NotifyClients method to send SSEs
Where ever in your code you want to send an event just call the NotifyClients methods with any data. It will be sent to all subscribed clients.

[HttpPost]
public async Task<IActionResult> CreatePost(CreatePostDto createPostDto)
{
    // save new post to database

    // send SSE to all the clients
    await EventsController.NotifyClients("post created");

    return Ok("Post created successfully");
}
Enter fullscreen mode Exit fullscreen mode

3. Usage in client-side

const connectToSSE = () => {
    const eventSource = new EventSource('/api/events');

    eventSource.onmessage = (event) => {
        console.log('New data received:', event.data);
        // Do something
    };

    eventSource.onerror = (error) => {
        console.error('SSE error:', error);
        eventSource.close();
    };
};
Enter fullscreen mode Exit fullscreen mode

Image of Datadog

Create and maintain end-to-end frontend tests

Learn best practices on creating frontend tests, testing on-premise apps, integrating tests into your CI/CD pipeline, and using Datadog’s testing tunnel.

Download The Guide

Top comments (0)

Image of Datadog

Create and maintain end-to-end frontend tests

Learn best practices on creating frontend tests, testing on-premise apps, integrating tests into your CI/CD pipeline, and using Datadog’s testing tunnel.

Download The Guide

👋 Kindness is contagious

Immerse yourself in a wealth of knowledge with this piece, supported by the inclusive DEV Community—every developer, no matter where they are in their journey, is invited to contribute to our collective wisdom.

A simple “thank you” goes a long way—express your gratitude below in the comments!

Gathering insights enriches our journey on DEV and fortifies our community ties. Did you find this article valuable? Taking a moment to thank the author can have a significant impact.

Okay