Skip to main content

Server-Sent Events in .NET: A Real-Time Update Example with Item API

 



In today's applications, delivering real-time updates to users is crucial for creating engaging experiences. One efficient way to achieve this in a .NET environment is by using Server-Sent Events (SSE). This blog will guide you through implementing SSE using an Item API to push real-time updates to clients.

What are Server-Sent Events?

Server-Sent Events (SSE) allow a server to push updates to clients over HTTP. Unlike WebSockets, which provide full-duplex communication, SSE is a simpler protocol suited for scenarios where updates flow from the server to the client, such as notifications or live content updates.

Why Use Server-Sent Events?

  • Simplicity: SSE is built on standard HTTP protocols, making it easier to implement compared to WebSockets.
  • Automatic Reconnection: The client automatically reconnects if the connection is lost.
  • Text-Based: SSE sends data in plain text, making it easy to parse.

Setting Up the Item API

Let's assume you have a simple Item API with basic CRUD operations. We will extend this API to support real-time updates for item changes.

Step 1: Create the Item Model

First, define the Item model in your .NET application.

public class Item
{
    public int Id { get; set; }
    public string Name { get; set; }
    public decimal Price { get; set; }
}

Step 2: Set Up the Controller

Next, create a controller that manages your items. Add a method for handling SSE connections.

[ApiController]
[Route("api/[controller]")]
public class ItemsController : ControllerBase
{
    private static readonly List<Item> Items = new();
    private static readonly List<HttpResponse> Clients = new();

    [HttpGet]
    public ActionResult<List<Item>> GetItems()
    {
        return Items;
    }

    [HttpPost]
    public ActionResult<Item> CreateItem([FromBody] Item item)
    {
        item.Id = Items.Count + 1;
        Items.Add(item);
        NotifyClients(item);
        return CreatedAtAction(nameof(GetItems), new { id = item.Id }, item);
    }

    // SSE endpoint
    [HttpGet("updates")]
    public async Task GetUpdates()
    {
        Response.ContentType = "text/event-stream";
        Response.Headers.Add("Cache-Control", "no-cache");

        // Add the response to the client list
        Clients.Add(Response);

        // Keep the connection open
        await Response.CompleteAsync();
    }

    private void NotifyClients(Item item)
    {
        foreach (var client in Clients)
        {
            var message = $"data: Item created: {item.Name}, Price: {item.Price}\n\n";
            client.WriteAsync(Encoding.UTF8.GetBytes(message));
        }
        Clients.Clear(); // Clear clients after notifying
    }
}

Step 3: Connecting the Client

In your front-end application (let's say a React app), set up an EventSource to listen for updates.

import React, { useEffect, useState } from 'react';

const ItemList = () => {
    const [items, setItems] = useState([]);
    
    useEffect(() => {
        const eventSource = new EventSource('https://yourapi.com/api/items/updates');

        eventSource.onmessage = (event) => {
            console.log('New event:', event.data);
            // Update the state or UI with the new item data
            // Example: setItems(prevItems => [...prevItems, JSON.parse(event.data)]);
        };

        return () => {
            eventSource.close();
        };
    }, []);

    return (
        <div>
            <h1>Items</h1>
            {/* Render the items list here */}
        </div>
    );
};

export default ItemList;

Step 4: Testing the Implementation

  1. Start your .NET application and ensure the Item API is running.
  2. Open your front-end application that uses the ItemList component.
  3. Use a tool like Postman or curl to make a POST request to create a new item:
POST /api/items
Content-Type: application/json

{
    "Name": "Sample Item",
    "Price": 19.99
}
  1. Watch your front-end application for real-time updates as new items are created.

Conclusion

Server-Sent Events provide a straightforward method for implementing real-time updates in your .NET applications. By utilizing SSE in our Item API, we demonstrated how to push notifications to clients seamlessly. This approach enhances user experience by delivering timely updates without requiring complex setups.

Feel free to expand on this implementation by adding features like error handling, custom event types, or filtering updates based on item changes. Happy coding!

Comments

Popular posts from this blog

Clean Architecture: What It Is and How It Differs from Microservices

In the tech world, buzzwords like   Clean Architecture   and   Microservices   often dominate discussions about building scalable, maintainable applications. But what exactly is Clean Architecture? How does it compare to Microservices? And most importantly, is it more efficient? Let’s break it all down, from understanding the core principles of Clean Architecture to comparing it with Microservices. By the end of this blog, you’ll know when to use each and why Clean Architecture might just be the silent hero your projects need. What is Clean Architecture? Clean Architecture  is a design paradigm introduced by Robert C. Martin (Uncle Bob) in his book  Clean Architecture: A Craftsman’s Guide to Software Structure and Design . It’s an evolution of layered architecture, focusing on organizing code in a way that makes it  flexible ,  testable , and  easy to maintain . Core Principles of Clean Architecture Dependency Inversion : High-level modules s...

C# : How can we access private method outside class

Introduction In object-oriented programming, encapsulation is a fundamental principle that restricts direct access to the internal implementation details of a class. Private methods, being part of this internal implementation, are designed to be accessible only within the confines of the class they belong to. However, there might be scenarios where you need to access a private method from outside the class. In this blog post, we'll explore several techniques to achieve this in C#. 1. Reflection: A Powerful Yet Delicate Approach Reflection is a mechanism in C# that allows inspecting and interacting with metadata about types, fields, properties, and methods. While it provides a way to access private methods, it should be used cautiously due to its potential impact on maintainability and performance. using System ; using System . Reflection ; public class MyClass { private void PrivateMethod ( ) { Console . WriteLine ( "This is a private method."...

20+ LINQ Concepts with .Net Code

LINQ   (Language Integrated Query) is one of the most powerful features in .NET, providing a unified syntax to query collections, databases, XML, and other data sources. Below are 20+ important LINQ concepts, their explanations, and code snippets to help you understand their usage. 1.  Where  (Filtering) The  Where()  method is used to filter a collection based on a given condition. var numbers = new List < int > { 1 , 2 , 3 , 4 , 5 , 6 } ; var evenNumbers = numbers . Where ( n => n % 2 == 0 ) . ToList ( ) ; // Output: [2, 4, 6] C# Copy 2.  Select  (Projection) The  Select()  method projects each element of a sequence into a new form, allowing transformation of data. var employees = new List < Employee > { /* ... */ } ; var employeeNames = employees . Select ( e => e . Name ) . ToList ( ) ; // Output: List of employee names C# Copy 3.  OrderBy  (Sorting in Ascending Order) The  Or...