HTML SSE API is a technology used to receive automatic updates from a server via HTTP connection, which allow web pages to update without the need for manual refreshing. It is part of the HTML5 specification and is supported by most modern web browsers.
SSE is based on a simple event-streaming protocol where the server sends a stream of data to the client over a single HTTP connection. This stream of data can contain any type of content, such as text, JSON, or XML. The server can push data to the client whenever there is an update, and the client can receive this data in real-time.
To use the SSE API in HTML, you can create an EventSource object and attach an event listener to it. The EventSource object listens for server-sent events and dispatches them to the listener when received.
Here is an example of using the SSE API in HTML:
<!DOCTYPE html>
<html>
<head>
<title>SSE Example</title>
<script>
// create a new EventSource object
var source = new EventSource("/sse.php");
// add an event listener to the source object
source.addEventListener('message', function(e) {
// display the received message in the browser console
console.log(e.data);
}, false);
</script>
</head>
<body>
<h1>SSE Example</h1>
<p>Check the browser console for updates.</p>
</body>
</html>
In this example, the HTML page creates a new EventSource object and attaches an event listener to it. The server-side script located at “/sse.php” sends a stream of data to the client, which is received by the event listener and displayed in the browser console.