How to determine when a user has officially left or entered a page

Question

I am currently working on a chat system simply as a mean of improving myself as a programmer as I am still young (17). When a user logs in, the message "{user} has entered the chat." gets displayed in the chat. Likewise, when a user logs out, the message "{user} has left the chat." gets displayed.

Both of these functionalities work fine as is. However, I would also like to determine when a user closes the page (leave message) and when he comes back (enter message).

In order to somewhat accomplish this, I do the following:

1, On the main chat page (chat.php), I set a session called onpage

2, When a user leaves the page, the following script will run in an onbeforeunload event through AJAX (jQuery):

    //setoffline.php

    unset($_SESSION["onpage"]); // unset the session
    if ($_POST['logout'] == "false") { // in our case, this will evaluate true
        sleep(3); // halt the script for 3 seconds
        if (isset($_SESSION["onpage"]) || !empty($_SESSION["onpage"])) 
            die();
        }
    }
    // if continued, send the offline message
    ...
    $_SESSION["left"] = "true";

3, The script runs, and then sleeps for three seconds before checking if the session still exists (if the user returned within three seconds the session would have been reset). If it does not then: the script will complete, the leave message will be sent, and the session left will be set.

4, When the user returns, an onload function is triggered which checks for the session left. If it is set, then the enter message will be sent and the session left will be unset.

The Issue:

By now, I am sure that you have identified an issue with my algorithm. I see many issues myself. For one, using the sleep function does not seem right nor does it work properly. It works correctly when closing the page (because no one returns within 3 seconds), however when you refresh, it causes the page to halt for the three seconds which I do not want. I simply want a way to identify when a user has officially left and conjugately returned to the page.

Answer 1

One option, as mentioned in another answer, would be to have every client poll the server at some set interval. The server would then assume that any client who hasn't polled recently has "left". One huge downside to this approach is that it uses a lot of bandwidth.

Another approach would be to move the logic that determines when to display the message into each client. When a user leaves the room the server somehow notifies everyone else in the room that the person has left. Rather than the client immediately displaying that message it could use a setTimeout and then check to see if the server has sent another message saying that the same user is back in the room. You can use a data attribute on some HTML block associated with the user to record that it may have left, and that it has returned.

---

As far as how to keep the connections between the various clients and the server I would recommend looking into a technique called BOSH.

The wikipedia page provides a really good introduction to what BOSH is and why it can be better than other alternatives, such as constantly "polling" the server.

Answer 2

The best solution is that make a AJAX call to server after every 5 or 10 seconds. This AJAX request will change the last online status (datetime) on server DB in respect of every user which is opened the page in his browser.

If he leaves the page, do nothing. In this case the AJAX request will not call and last online time will not update.

Now other side where you are showing that user is came online and has goes offline. Here is an another Ajax request (every 5 or 10 seconds) pull data from server, which determine who is online before 5 or 10 seconds ago. According to user's past stat and present stat you can determine status of online/offline of every user.

Hope you understand.