What the difference between `onmessage` and `.addEventListener`?

javascript, server-sent-events

Solution

`source.onmessage` is the built in function wrapper for `EventSource` that is triggered when new data is sent to the client. It fires when no `event` attribute is returned (default) and doesn't fire when it is set.

`addEventListener` is similar, but differs in that it listens for a specific `event` name, and triggers on its presence, allowing you to separate your functionality for multiple events. You can then parse the JSON data returned. It can be used on any event type. Have a look at this example:

source.addEventListener("login", function(e) {
    // do your login specific logic
    var returnedData = JSON.parse(e);
    console.log(returnedData);
}, false);

This snippet will listen for a server message with `event` specified as `login`, then it triggers the callback function.

More info:

- https://developer.mozilla.org/en-US/docs/Server-sent_events/Using_server-sent_events

- http://html5doctor.com/server-sent-events/

Problem

I'm trying to get data with server-sent event, what the different using `source.onmessage` vs `source.addEventListener`?

Original source