-1

I am trying to create a display list of logged in users. So imagine, on the left panel, I have a list of logged in people. Whenever a new person is logged in, that list will be immediately updated and show to all other people.

I have trouble finding a tutorial for this because I don't know the right phrase to search for. Please give me a recommendation.

Nam Thai
  • 35
  • 8
  • 1
    Take a look [here][1]. It should provide you with everything you need. [1]: http://stackoverflow.com/questions/3583203/server-polling-with-javascript – Saladin Akara Jun 20 '13 at 00:22

2 Answers2

1

This is a fairly broad question, and the answer will depend heavily on your environment. Is your site's backend in PHP? Node? Rails? Etc. How are you storing the list of logged in users?

Once you figure that out, the short answer is "use AJAX", basically you'll want to poll a server side script periodically asking for a list of users (the script will probably read from a file/database). jQuery's $.get method can do this. When the list changes, you re-render your HTML list.

If you have more questions about the steps of this process, please let me know.

hamstu
  • 1,644
  • 1
  • 11
  • 19
  • Thank you for your answer. My script is backed by PHP. I am wondering if I should store the list of logged in users on mySQL or just a simple text file on the server. So as far as I understand, AJAX will look into the logged list every so often and update it to the users' screen accordingly? – Nam Thai Jun 20 '13 at 00:35
  • 1
    No need to reinvent the wheel, in my answer below I recommend using a third party service like Pusher. – omarshammas Jun 20 '13 at 00:41
  • Agreed. Something like Pusher would likely scale much better as well. But this is still fairly easy for something simple and low-traffic. – hamstu Jun 20 '13 at 00:45
  • Yeah I'm likely to read about Comet and implement it myself. But good to know about Pusher – Nam Thai Jun 20 '13 at 01:13
  • @hamstu I have one small question: how do I update logged in users list when an user close the browser? Right now I can update the list whenever the users click Log out button – Nam Thai Jun 20 '13 at 01:20
1

When a user logs in all logged in users must be notified in real-time.

With html5 you can use websockets. However, prior to that there are several different techniques known as comet

The most naive implementation is old school polling, where each client would poll the server every X seconds using ajax asking for a list of all logged in users. Simultaneously, this can be used as a heartbeat to verify that the user is still active because some users may not have logged out using the log out link and simply closed the tab.

One step up is called long polling where instead of polling every X seconds, a single ajax request is sent and the server only responds once some event has occurred ('someone logs in'). Once the client receives a response it immediately sends another ajax request to reestablish the connection.

It is worth understanding the underlying details, but there is no need to reinvent the wheel. I use a service called pusher. It also has webhooks to alert you once a connection has been terminated which can be useful for determining when the user has closed the tab without logging out.

How do these third party services work?

They require you to add a js snippet to your html page which will establish a connection with their servers. Web sockets are used if supported by the browser otherwise one of several fall back methods can be used such as comet or flash for older browsers.

When you wish to send information, you simply make a post request to the service which will then alert the intended client over the already open connection.

omarshammas
  • 631
  • 4
  • 18