How To Logout My Application When I Closed The Window?

In my chat application i am having the logout button and it works fine. Now I need to logout the application when I closed the browser window also..How can I achieve this... Thanks

Solution 1:

There is no exact way to do this with the clientside. There is no event that is fired when the page is exited. It should be done with the Session End event on the server.

You can try to use onbeforeunload or unload, but race conditions will prevent that from happening. AND they do not fire for browsers crashing, lost internet connection, etc.

Solution 2:

I dealt with this issue recently in my angularJS app - The main issue was that I don't want to log you out if you refresh, but I do want to if you close the tab.. Ajax requests with onbeforeunload/onunload aren't guaranteed to wait for response, so here is my solution:

I set a sessionStorage cookie on login that is just a bool - set to true when I get login response

sessionStorage.setItem('activeSession', 'true');

Obviously, on logout, we set this flag to false

Either when controller initializes or using window.onload (in my app.js file) - I check for this activeSession bool.. if it is false, I have this small if statement - where if conditions are met I call my logout method ONLOAD instead of onunload

var activeSession = sessionStorage.activeSession;
    if (sessionStorage.loggedOutOnAuth) {
        console.log('Logged out due to expiry already')
    }
    elseif (!activeSession) {
        sessionStorage.loggedOutOnAuth = true;
        _logout()
    }

Basically, the "loggedOutAuth" bool let's me know that I just expired you on page load due to the absence of an activeSession in sessionStorage so you don't get stuck in a loop

This was a great solution for me since I didn't want to implement a heartbeat/websocket

Solution 3:

Add your logout code to the on onunload event.

window.onunload = function () {
    //logout code here...
}

In JQuery you can use the .unload() function. Remember that you don't have much time so you may send the Ajax request but the result may not reach the client.

Another trick is to open a small new window and handle the logout there.

window.open("logout url","log out","height=10,width=10,location=no,menubar=no,status=no,titlebar=no,toolbar=no",true);

If you want to disable closing the window (or at least warn the user), you can use this code:

window.onbeforeunload = function(event) {
    //if you return anything but null, it will warn the user.//optionally you can return a string which most browsers show to the user as the warning message.returntrue;
}

Another trick is to keep pinging the client every few seconds. If no reply comes back, assume the user has closed the window, browser has crashed or there is a network issue that ended the chat session anyway. On the client side, if you don't receive this ping package, you can assume that network connection or server has a problem and you can show the logout warning (and optionally let the user login again).

Solution 4:

Some websites are using the following script to detect whether window is closed or not.

if(window.screenTop > 10000)
alert("Window is closed");
else
alert("Window stillOpen");

You need to add the correct action instead of alert()

also take a look HERE - I think this is somthing you need to detect the window closing

Solution 5:

Another approach is some sort of "keepalive": the browser page "pings" the server with a small ajax request every minute or so. If the server doesn't get the regular pings, the session is closed and can no longer be used.

As an optimization, the pings can be skipped if we have made another request to the server in the interim.

Advantages:

• still works with multiple windows open
• no problem with F5 / refresh
• can provides some usage statistics to the server

Disadvantages:

• when the window is closed, there is a delay before the user is logged out
• uses a little network bandwidth
• additional load on the server
• users might have concerns about the page constantly "phoning home"
• more difficult to implement

I've never actually done this in a web app, and not sure if I would; just putting it out there as an alternative. It seems like a good option for a chat app, where the server does need to know if you are still there.

Rather than polling / pinging, another possibility is to keep a "long running request" open while the page is open. A chat app needs some such socket to receive new messages and notifications. If the page is closed, the socket is closed too, and the server can notice that it has been closed. It then waits a brief time for the client to establish a new socket, and if it doesn't we assume the page is closed and delete the session. This would require some slightly unusual software on the server.