How to handle browser close event through Java script

Question

I have an application which logs users session once he logins. Say I have view case page and when user clicks a case it would be locked by that user and the action is tracked by inserting an entry into lock table with the java Session, caseid and userId.

Now when the user click any other tab within the application, including logout an action is called to delete the session id in the lock table for that user and case. I have a requirement to release this lock even when the user closes the browser close button. My backend code will handle the scenario when the elapsedTime of the lock is greater than 10mins.

However, when the user closes the browser and some other user logins to view the same case within this span of 10mins it still shows the lock by the previous user. So I have to capture the browser close event and do the same action as I do for logout and other tab click.

My below piece of java script code works well in IE browser for browser close but doesn't work in chrome or firefox. Can someone suggest which event to use in chrome/firefox please?

<script type="text/javascript"> document.getElementById('logoff').onclick = function() { sessionStorage.setItem('accept', '0'); location.href="/abc/logout/"; }; $(document).ready(function() { var validNavigation = false; // Attach the event keypress to exclude the F5 refresh (includes normal refresh) $(document).bind('keypress', function(e) { if (e.keyCode == 116) { validNavigation = true; } }); // Attach the event click for all links in the page $("a").bind("click", function() { validNavigation = true; }); // Attach the event submit for all forms in the page $("form").bind("submit", function() { validNavigation = true; }); // Attach the event click for all inputs in the page $("input[type=submit]").bind("click", function() { validNavigation = true; }); $("input[type=button]").bind("click", function() { validNavigation = true; }); window.onbeforeunload = function() { if (!validNavigation) { sessionStorage.setItem('accept', '0'); location.href="/abc/logout/"; } }; }); </script>

Gh05d · Accepted Answer · 2021-06-08 19:26:19Z

It seems like using the onbeforeunload property is discouraged:

Typically, it is better to use window.addEventListener() and the beforeunload event, instead of onbeforeunload.

It should look like this:

window.addEventListener('beforeunload', function (e) { // the absence of a returnValue property on the event will guarantee the browser unload happens delete e['returnValue']; if (!validNavigation) { sessionStorage.setItem('accept', '0'); location.href="/abc/logout/"; } });

Appreciate your reply. But again this works in IE but not in chrome or firefox.
I just took another look at the page and especially at the Browser compatibility table. developer.mozilla.org/en-US/docs/Web/API/WindowEventHandlers/… Seems like the only browser really supporting the event is Internet Explorer. I guess you should switch to another method.

Collectives™ on Stack Overflow

How to handle browser close event through Java script

1 Answer 1

2 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Related