HTML and CSS Reference
In-Depth Information
Since the browser just needs to passively receive data from the
server, Server-Sent Events are a good match.
Now let's assume that while you're carefully monitoring Bruce's
adorations on your app, you lose the connection. When you
return online,
EventSource
will tell the server that the last mes-
sage ID was 69; the server is now up to message ID 78. So the
application on the server realises that you've missed a bunch
of messages, and the server will send back all the messages
from 70 onwards. Your client code doesn't change in any way,
since each of those missing eight messages will just trigger the
message
event, and everything will be plotted accordingly.
Here's an example of said application:
var es = new EventSource('/bruces-pink-toy');
es.onopen = function () {
initialiseChart();
};
es.onmessage = function (event) {
var data = JSON.parse(event.data);
chart.plot(data.time, data.sentiment);
};
Server-Side Events—the server side technology
On the server side, you could use a PHP-based setup (LAMP for
instance), but since Apache (the A in LAMP) doesn't support persistent
connections very well, it will keep dropping the connection, and the
EventSource
will keep on reconnecting automatically. This will effec-
tively result in something more akin to an Ajax polling application.
This isn't the best way of doing things, but I appreciate that PHP prob-
ably has the lowest barrier of entry for most of us, so knowing that it
can still work is useful. To take real advantage of the
EventSource
,
you need a persistent connection to the server, and your typical LAMP
setup isn't going to cut it.
Yo u c a n , a n d p r o b a b l y s h o u l d , o p t f o r a n e v e n t - b a s e d s e r v e r. G o i n g
into great detail about this is way beyond the scope of this topic, but
I'd recommend looking at Node.js (a JavaScript-based server platform)
or something like Twisted for Python.
