Log User Out Only on browser or tab close - javascript

Hi There im looking for a way to log a user out of my site ONLY if they close the tab or browser.
At the moment im just trying to alert a message on tab close or browser close but cant find a solution anywhere.
I've done research and come across onbeforeunload, however it alerts every time you try to navigate to a different page in the site.
i need to be able to navigate through the site and perform functions and only perform an action on close.
Current code (alerts message every time you navigate)
<script>
function closeIt()
{
if (window.closed) {
return "Any string value here forces a dialog box to \n" +
"appear before closing the window.";
}
}
window.onbeforeclose = closeIt;
</script>

First detect browser tab close:
$(document).ready(function()
{
$(window).bind("beforeunload", function() {
return confirm("Do you really want to close? This will log you out of your profile.");
});
});
Than change your login preference based on return value.
https://developer.mozilla.org/en-US/docs/Web/Events/beforeunload

Related

Is it possible to fire a modal when the user attempts to close the browser with AngularJS?

like says my title...
Is it possible to fire a modal when the user attempts to close the browser with AngularJS? I need to show the modal for the user to fill out a survey.
If that is possible, have u some tuto? I have trying the next code in my controller, but displays a confirm window.
$window.onbeforeunload = function (event) {
var message = 'If you leave this page you are going to lose all unsaved changes, are you sure you want to leave?';
if (typeof event == 'undefined') {
event = $window.event;
}
return message;
};
Thanks for ur help.
beforeunload is a browser standard. Whatever you return from the function is the message that displays in the confirmation dialog before closing the window.
If you're using a browser that complies to this standard like Firefox, Chrome, or IE, you won't be able to hijack the native behaviour. So, your confirmation message should be persuasive enough for the user to want to stay on your site.

Avoid popup on refresh. show only when user close browser window

I want to show popup only when user close the browser window. But, In the following code. It showing popup when I refresh the page.
My Code
<script type="text/javascript">
$(document).ready(function()
{
var key = true;
$(window).bind('beforeunload', function(e){
if(key)
return confirm("Do you really want to close? This will log you out of your profile.");
e.preventDefault()
});
$(document).on("click","a",function() {
key=false;
});
});
</script>
This is essentially what you need.
Source: open a custom popup on browser window/tab close
JSFiddle: http://jsfiddle.net/SQAmG/5/
var popit = true;
window.onbeforeunload = function() {
if(popit == true) {
popit = false;
return "Are you sure you want to leave?";
}
}
EDIT
Use HTML5 Web Storage to simulate sessions within the browser. Here you would want to use sessionStorage rather than localStorage so the session ends when the browser window is completely closed.
If the sessionStorage variable is set, do not start the popup, otherwise allow the popup code to execute.
HTML5 Web Storage: http://www.w3schools.com/html/html5_webstorage.asp
If you set onbeforeunload callback, it will be executed every time whether you close the tab or refresh the page. So, lets get into some hack here. When we close the tab, the window loses its focus. So Inside onbeforeunload we will just check if the window has focus. If it has, you are refreshing the page. If it has lost focus, probably you have closed the tab.
window.onbeforeunload=function(){
if(!document.hasfocus()){
//show popup
}
}

Trigger function or event when closing browser tab using Javascript

Is it possible to trigger a function when a using closes the browser tab and prevent it from closing instead a popup will ask the user to proceed to other page or continue to close the browser page?
Scenario:
When the user closes the browser tab of a page, then it wont close right away instead a custom popup (possibly html popup) will prompt and ask if continue to close or proceed to other page. So it would have 2 buttons, "Close" and "Proceed to Page".
If it's not possible using HTML popup, prompt would be fine too. But it should be crossbrowser.
By the way, i prefer using Javascript.. So that's my ideal script to make this function work
Thanks :)
You're looking for onbeforeunload:
window.onbeforeunload = function() {
return "Are you sure you wish to leave the page?";
}
Just know that you will really annoy your visitors if you do this, it is strongly disliked.
Try this:
var popit = true;
window.onbeforeunload = function() {
if(popit == true) {
popit = false;
return "Are you sure you want to leave?";
}
}
Working Fiddle

How to embed a url/page redirection script to a closing pop up window

Please am making use of this script bellow to execute a pop up window when the close button is clicked on but i want to add an extra script that will help me open a new url/page when the "OK" button is clicked please can anyone help me out, here is the javascript am using:
<script language="Javascript">
var needToConfirm = true;
window.onbeforeunload = confirmExit;
function confirmExit(){
if (needToConfirm){
my_window = window.open ("1.html","mywindow1","status=1,width=350,height=150");
return "You have attempted to leave this page. If you have made any changes "
+"to the fields without clicking the Save button, your changes will be "
+"lost. Are you sure you want to exit this page?";
}
}
</script>
i want to add an extra script that will help me open a new url/page when the "OK" button is clicked
That is by definition not possible. If the user confirms they want to leave the page, the page has no way of doing anything any more. It's a security feature to prevent sites that get closed from spamming the user with new windows.
looks like you want the parent (the opener) window to reload / load a page?
here is an example how to do this:
http://www.plus2net.com/javascript_tutorial/window-refreshing.php

I need to close a pop-up window after some period of time

I need to close the pop-window which is triggered from 3rd party site after some time passes.
I know we can close the pop-up using setTimeout("self.close()",5000) in body of the page, but the pop-up is triggering from other server.
I don't think you can control windows that are opened from a different session. Pretty sure that would be a big security hole if you could.
Check this out.
<script type="text/javascript">
var pop;
function cl() {
form1.elements["wt"].value=65;
pop.close();
}
function open_win()
{
pop = window.open("loading_page.html",'popUpWindow','height=200,width=150,left=10,top=10,resizable=yes,position=center,scrollbars=yes,toolbar=no,menubar=no,location=no,directories=no,status=yes',align="center");
setTimeout("cl()",5000);
}
</script>
I used the cl() to populate a textfield after 5 seconds having form name as form1 and textfield name as wt.
Just call the close method of the new window.
function() { // It is a popup, so obviously you need to call this from a user triggered event and not page load
var pop = window.open('http://example.com');
var close = function() {
pop.close();
};
setTimeout(close, 2000);
}

Categories

Resources