Deseo detectar cuando la persona abandone mi página web, ya sea cerrando la pestaña del navegador o cerrando completamente el navegador, detectar cuando abandona la página.
Esto porque deseo cerrar la transacción del tiempo que duró activa la sesión de usuario, por ahora funciona si el usuario usa los botones de cierre que tengo dentro de mi página web, pero si cierra abruptamente el aplicativo cerrando la pestaña o el navegador, nunca se cierra esa sesión que se activo para esa persona y pues por cuestiones ya de políticas del aplicativo, al volver a entrar es una nueva sesión que se crea para el usuario.
Es por esto que necesito una forma para poder detectar la salida del usuario.
He probado con las sentencias de onunload
y onbeforeunload
pero no funcionan.
Intenté con este código:
<HTML>
<HEAD>
</HEAD>
<BODY onunload="confirm('Estas seguro de terminar la sesion')">
<a href="http://www.google.com/;" mce_href="http://www.google.com/">Google</a>
</BODY>
</HTML>
Y también con este:
<HTML>
<HEAD>
<SCRIPT>
function Cerrar() {
console.log("Se va a cerrar la ventana");
event.returnValue = "Te estás saliendo del sitio…";
}
</SCRIPT>
</HEAD>
<BODY onbeforeunload="return Cerrar()">
<a href="http://www.google.com/;" mce_href="http://www.google.com/">Google</a>
</BODY>
</HTML>
Pero ninguno funciona, necesito algo donde no sé, pueda emitir una alerta para saber que el usuario va a cerrar la ventana...
Actualización
Acabo de probar un nuevo código del post https://stackoverflow.com/questions/1631959/how-to-capture-the-browser-window-close-event pero tampoco funciona, solo me detecta el F5 y pues ese no me hace falta, al igual que cuando pulso la X, me cierra la ventana sin emitir nada.
El código usado fue:
<HTML>
<HEAD>
</HEAD>
<BODY>
<a href="http://www.google.com/;" mce_href="http://www.google.com/">Google</a>
</BODY>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
var inFormOrLink;
$('a').on('click', function() { inFormOrLink = true; });
$('form').on('submit', function() { inFormOrLink = true; });
$(window).on("beforeunload", function() {
return inFormOrLink ? "Do you really want to close?" : null;
});
</script>
</HTML>
Solución
Usé la sentencia
window.addEventListener("beforeunload", function (e) {
var confirmationMessage = "\o/";
(e || window.event).returnValue = confirmationMessage; //Gecko + IE
return confirmationMessage; //Webkit, Safari, Chrome
});
A mi me funcionó, claro, la adapte para no emitir mensaje sino emitir la acción que deseaba