How to determine that an SSE connection was closed?

In handling Server-Sent Events (SSE), ensuring proper closure of the connection is crucial to prevent resource wastage and potential memory leaks. Below are several methods to determine if an SSE connection has been closed:

1. Listen for the error event

The SSE API provides an EventSource object that you can monitor for the error event on the client side. When the connection is severed—whether due to the server closing or network issues—the error event is triggered. At this point, you can check the readyState property of the EventSource object to determine the connection status.

javascript
var eventSource = new EventSource('path/to/sse');

eventSource.onerror = function(event) {
    if (this.readyState == EventSource.CLOSED) {
        console.log('Connection was closed.');
    }
};

In this example, EventSource.CLOSED indicates that the connection has been closed.

2. Implement Heartbeat Detection

Network disconnections can sometimes occur silently without triggering events. To address this, implement a heartbeat mechanism where the server periodically sends a comment field or an empty message as a heartbeat, and the client checks these messages at regular intervals.

If no heartbeat is received within the expected time frame, the client can assume the connection has been lost and attempt to reconnect.

javascript
var eventSource = new EventSource('path/to/sse');
var lastHeartbeat = new Date();

eventSource.onmessage = function(event) {
    lastHeartbeat = new Date(); // Update the timestamp of the last received message
};

function checkHeartbeat() {
    var now = new Date();
    // Assume the server sends a heartbeat every 5 seconds
    if (now - lastHeartbeat > 10000) { // 10 seconds without a heartbeat indicates a disconnect
        console.log('Connection might be lost.');
        eventSource.close(); // Close the connection
    }
}

setInterval(checkHeartbeat, 5000); // Check every 5 seconds

3. Listen for Server-Side Close Events

On the server side, you can also monitor client disconnection events. In Node.js, when using frameworks like Express to handle SSE, listen for the close event on the req object.

javascript
app.get('/path/to/sse', function(req, res) {
    req.on('close', function() {
        console.log('Client closed the connection');
        // Clean up related resources, end the response, etc.
    });
});

This method is particularly useful as it allows the server to detect when the client closes the connection, enabling it to release resources associated with that specific client.

Conclusion

Ensuring proper closure of SSE connections not only enhances application responsiveness and reliability but also helps avoid resource wastage and potential performance issues. The above methods can be selected and adjusted based on specific application scenarios and requirements.