I have an SSE Server that has the following settings/requirements:
- C# dotnet 8
- Non Blocking Communication
- No ASP
- No Extention
- Allow CORS
On the other side (client) I have an Browser with JavaScript
The Problem:
I can see the communication from the client to the server.
The Server accepts the request and send packets back to the client.
I can see the received packets with wireshark, but the javascript do not responds to the received packets.
If I try to use curl, then I receive the header. Then after a short period of time the cached packets (many packets). But I think the cache is full and I see the cache.
Here is the c# SSE Server code:
using System;
using System.Collections.Generic;
using System.Net;
using System.Text;
using System.Threading.Tasks;
using System.Timers;
class Program
{
private static readonly List<HttpListenerContext> clients = new List<HttpListenerContext>();
private static readonly object lockObject = new object();
private static System.Timers.Timer? messageTimer;
static async Task Main(string[] args)
{
string url = "http://+:5000/";
HttpListener listener = new HttpListener();
listener.Prefixes.Add(url);
listener.Start();
Console.WriteLine($"Server runs on {url}");
// Timer
messageTimer = new System.Timers.Timer(1000);
messageTimer.Elapsed += SendPeriodicMessages;
messageTimer.AutoReset = true;
messageTimer.Enabled = true;
while (true)
{
HttpListenerContext context = await listener.GetContextAsync();
HandleClient(context);
}
}
private static void HandleClient(HttpListenerContext context)
{
HttpListenerRequest request = context.Request;
HttpListenerResponse response = context.Response;
response.Headers.Add("Access-Control-Allow-Origin", "*");
response.Headers.Add("Access-Control-Allow-Methods", "GET, OPTIONS");
response.Headers.Add("Access-Control-Allow-Headers", "Content-Type");
if (request.HttpMethod == "OPTIONS")
{
response.Headers.Add("Access-Control-Allow-Origin", "*");
response.Headers.Add("Access-Control-Allow-Methods", "GET, OPTIONS");
response.Headers.Add("Access-Control-Allow-Headers", "Content-Type");
response.StatusCode = (int)HttpStatusCode.OK;
response.OutputStream.Close();
return;
}
response.Headers.Add("Content-Type", "text/event-stream");
response.Headers.Add("Cache-Control", "no-cache");
response.Headers.Add("Connection", "keep-alive");
AddClient(context);
}
private static void AddClient(HttpListenerContext context)
{
lock (lockObject)
{
clients.Add(context);
var clientIp = context.Request.RemoteEndPoint.Address.ToString();
var clientPort = context.Request.RemoteEndPoint.Port;
Console.WriteLine($"Client connected: IP = {clientIp}, Port = {clientPort}");
}
}
static int TimerCounter = 0;
private static void SendPeriodicMessages(object? sender, ElapsedEventArgs e)
{
Console.WriteLine("TimerTick " + TimerCounter);
SendMessagesToClients("data: " + TimerCounter++ + "\n\n");
}
private static void SendMessagesToClients(string message)
{
Task.Run(async () =>
{
byte[] buffer = Encoding.UTF8.GetBytes(message);
List<Task> sendTasks = new List<Task>();
List<HttpListenerContext> removeList = new ();
lock (lockObject)
{
Console.WriteLine("Number of Clients: " + clients.Count);
foreach (var client in clients)
{
sendTasks.Add(Task.Run(() =>
{
try
{
HttpListenerRequest request = client.Request;
HttpListenerResponse response = client.Response;
var clientIp = client.Request.RemoteEndPoint.Address.ToString();
var clientPort = client.Request.RemoteEndPoint.Port;
Console.WriteLine($"Sending Data ({buffer.Length}) to {clientIp}:{clientPort}");
response.OutputStream.Write(buffer, 0, buffer.Length);
response.OutputStream.Flush();
}
catch (Exception ex)
{
Console.WriteLine($"Error - Cant send data to Client: {ex.Message}");
removeList.Add(client);
}
}));
}
}
await Task.WhenAll(sendTasks);
lock (lockObject)
{
while (removeList.Count > 0)
{
clients.Remove(removeList.First());
removeList.RemoveAt(0);
}
}
});
}
}
And the JavaCode:
<!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>TEST</title>
</head>
<body>
<h1>
Server Send Event
</h1>
<div id="messages"></div>
<script>
const eventSource = new EventSource('http://192.168.56.245:5000/');
eventSource.onmessage = function(event) {
const messagesDiv = document.getElementById('messages');
messagesDiv.innerHTML += `<p>${event.data}</p>`;
console.log(event.data);
};
eventSource.onerror = function(event) {
console.error("Error receiving messages from SSE:", event);
eventSource.close();
};
</script>
</body>
</html>
