Loading...
HTML SSE
Some UIs need live updates — scores, logs, status. Server-Sent Events (SSE) stream text messages from server to browser over HTTP.
Direct answer
In the page script: const es = new EventSource("/events") then listen for message (or named events). The server must send a compatible text/event-stream response. SSE is one-way (server → client). Two-way sockets are a different tool (WebSockets).
EventSource on a page
html
HTML Code
<script>
const es = new EventSource("/events");
es.onmessage = (e) => {
console.log("update", e.data);
};
es.onerror = () => console.log("SSE error / closed");
</script>You need a server endpoint for a real demo. This lesson teaches the browser side pattern so you recognize SSE in docs and apps.
Try it
- Read a minimal SSE server example from trusted docs when you have a backend
- Wire
EventSourceto that URL - Log incoming
e.data - Remember one-way vs two-way communication needs
Easy mistakes
- Expecting SSE to send browser→server messages like a socket
- Forgetting the server content type for event streams
- Using SSE when simple polling would be enough for rare updates
Summary
- SSE pushes server updates to the page
- Use EventSource in JavaScript
- One-way over HTTP
- WebSockets if you need full duplex
🧠 Test Your Knowledge
Ready to Start
Test Your Knowledge
Challenge yourself with this interactive quiz and see how well you understand the topic
3
Questions
70%
To Pass
∞
Time
∞
Attempts
📝 Instructions
- Read each question carefully
- Select the best answer for each question
- You can retake the quiz as many times as you want
- Your progress will be shown at the top