Suppose there is a webpage with dynamically generated content — say a div containing the current number of connected browsers. When the count changes on the server I want all connected browsers to reload the count so that everyone sees the increment/decrement.
What’s the best way to accomplish this?
Keywords: ajax, broadcast, browser, div, jquery
Here’s how to do server-push using ajax long-polling. The browser makes an ajax request which initiates server-side self-polling. The ajax request remains open, waiting for a response until the file changes, and as soon as it gets a response, it makes a new long-polling request.
Here’s what it looks like with jQuery and php, implementing the example of live-updating a div in the html showing the number of clients currently connected:
index.html:
longpolling.js:
LongPolling.php:
NOTE: This does not track disconnects, so it’s more like live-tracking the total number of pageviews.
See Running server-side function as browser closes for info on keeping track of browser disconnects, ie, server-side action on client disconnect.