What is Server-Sent Events (SSE) and how to implement it?
Server sent events(SSE) is a pushing technology that enables pushing notification/message/events from the server to the client(s) via HTTP connection.
While you are developing real-time projects, there is always a one-question mark on “how to send messages/updates from server to client”. We can talk about three different ways to perform server-to-client updates: Client polling, Web Socket, Server-Sent Events (SSE).
The client sends requests to the server at regular intervals for new updates. Although this technique is not used much nowadays, it can be preferred for some small-medium size projects. It is easy to implement. This technique does not provide a fully-real time system that depends on the request intervals.
In the polling technique, requests are sent and managed by the client side. Requests are sent by the client even if there is no update on the server.
Websocket is a very popular technology that provides bi-directional data transfer for client and server communication on real-time applications. Websocket is not based on HTTP protocol, so it requires additional installation and integrations to use it. It is difficult to implement compared to other technologies that were mentioned above.
SSE is a technology that provides asynchronous communication with event stream from server to the client over HTTP for web applications. The server can send un-directional messages/events to the client and can update the client asynchronously. Almost every browser is supporting the SSE except Internet Explorer :)
Server-sent event (SSE) enables servers to send messages from the server to the client without any polling or long-polling. Let’s take a quick look at the list that SSE can use:
- E-commerce Projects (notify whenever the user needs the information)
- Tracking system
- Alarm/Alert Projects
- IoT Projects (Alarm, notify, events, rules, actions)
- Stock Markets (Bitcoin etc.)
- Breaking news, Sports Score Updates
- Delivery projects
- In-app notifications
In short, SSE can be used in all web applications where users need real-near time information.
The server-sent events streaming can be started by the client’s GET request to Server.
Accept: text/event-stream indicates the client waiting for event stream from the server,
Cache-Control: no-cache indicates that disabling the caching and
Connection: keep-alive indicates the persistent connection. This request will give us an open connection which we are going to use to fetch updates. After the connection, the server can send messages when the events are ready to send by the server. The important thing is that events are text messages in
List of pre-defined SSE field names include:
- event: the event type defined by application
- data: the data field for the event or message.
- retry: The browser attempts to reconnect to the resource after a defined time when the connection is lost or closed.
- id: id for each event/message
data: GOAL Liverpool 1 - 1 Arsenal
data: GOAL Manchester United 3 - 3 Manchester City
So how to implement this great technology into our projects. Let’s get started with Spring Webflux.
Server-Sent Event Application with Spring Webflux
Spring Webflux is a framework built on Project Reactor that supports reactive, asynchronous, and non-blocking programming to develop web applications. We are going to build a live score application that provides real-time live score updates to the clients via Server-sent events.
- Mono: A publisher that can contain 0 or 1 event.
Mono<String> stringMono = Mono.just("Hey Gokhan");
Mono<Integer> integerMono = Mono.just(1);
Mono<Object> monoError = Mono.error(new RuntimeException());
Mono<Object> monoEmpty = Mono.empty();
- Flux: Publisher that can contain 0..N events.
Flux<String> stringFlux = Flux.just("Gokhan", "SSE", "Article");
Flux<Integer> fluxRange = Flux.range(1.5);
Flux<Long> longFlux = Flux.interval(Duration.ofSeconds(1));
First of all, the
spring-boot-starter-webflux dependency needs to be added to Gradle or Maven. Now we can build a simple SSE reactive application with Webflux objects. (source codes: Github Repository)
We are building a live-score application so we need to define our property to the
Let’s create a class that provides a publisher with the live-core input and subscribe method for the real-time update to the connected clients.
And now we should provide the endpoint for publishing the live-score and server-sent events for the clients.
send method will create an event and this event will be published to the clients via server-sent events.
curl --location --request POST 'http://localhost:8080/api/v1/live-scores' \
--header 'Content-Type: application/json' \
The most important part of the project is SSE for live updates. We are building an endpoint that represents the
GET HTTP method for the event stream and
Content-Type and we are providing a live stream with
Flux objects which are provided from Spring Webflux.
@GetMapping(path = "/live-scores", produces = MediaType.TEXT_EVENT_STREAM_VALUE)
public Flux<ServerSentEvent<Object>> consumer()
We can build an event using
ServerSentEvent that includes all pre-defined methods such as
id, data, event, retry and
Run the application after you clone(from Github Repository) or develop it. Run the following Gradle command for the live-score application that we build:
We are ready for the Demo:
Open the browser and hit the URL:
http://localhost:8080/api/v1/live-scores The stream of data has the live score be displayed whenever it is published by the server.
Server-sent events is a way of reactively sending messages from a server. Server-sent events is the perfect solution for real-time applications. it is lightweight, fast, easy to implement and it provides low latency.
All source code is available on Github Repository.
— — 1:1 Superpeer
Server Sent Events using Reactive Kafka and Spring Web flux | Gagan Solur Venkatesh, Egen Solutions…
Server-Sent Events (SSE) is a server push technology where clients receive automatic server updates through the secure…