Question

I’m using the Server-Sent Events to push new data to users through a Webapp. I’d like to avoid to display twice the same data. My idea was to use the e.lastEventId as Mozilla’s documentation recommends.

Data displayed in test_stream.php :

id: 3
data: test

JS Script :

var source = new EventSource('test_stream.php');
source.onmessage = function(e) {
    var now_id = e.lastEventId;

    if(last_id != now_id) {
        var last_id = e.lastEventId;
        document.body.innerHTML += e.data + '<br>';
    }
};

Problem :

“test” is displayed every 3 sec instead of only one until new data come. I get well the ID but it looks like if my ‘if’ in the js script doesn’t work… Any idea ?

Answer 1

var source = new EventSource('test_stream.php');
var last_id;
source.onmessage = function(e) {
    var now_id = e.lastEventId;

    if(last_id != now_id) {
        last_id = e.lastEventId;
        document.body.innerHTML += e.data + '<br>';
    }
};