<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>SSE Example</title>
</head>
<body>
<h1>Server-Sent Events Example</h1>
<div id="sse-data"></div>

<script>
  const eventSource = new EventSource("/sse")
  const sseDataElement = document.getElementById("sse-data")

  eventSource.onmessage = (event) => {
    sseDataElement.innerText = `Data from server: ${event.data}`
  }

  eventSource.onerror = (error) => {
    console.error("EventSource failed:", error)
    eventSource.close()
  }
</script>
</body>
</html>