Event when user closed tab/page

Question

I need to know how perform a function the same instant I close the page, for example I want to send an alert to the user as soon as it leaves

Searching here on the site I found this code:

window.onunload = function() {
    alert('Valeu, falow.');
    //Seu código aqui
}

Only I couldn’t implement it in my project!

I hope you can help me!

Answer 1

You should wear this:

window.onbeforeunload = function(){

    return "Hello"

}

A window’s onbeforeunload Property may be set to a Function that Returns a string that is Shown to the user in a dialog box to confirm that the user wants to navigate away. This was intended to Prevent users from losing data During navigation. Unfortunately, it is often used to scam users.

It basically says that you have to return a string to the user, so that they can decide whether or not they will leave. but...

Starting in Chrome 51, a custom string will no longer be Shown to the user. Chrome will still show a dialog to Prevent users from losing data, but it’s Contents will be set by the browser Instead of the web page.

From google Chrome 51, returning strings is no longer allowed, meaning you can even, but Chrome will display their default message.

Explaining the closing of the page

//MEUS ARQUIVOS
/
/index.js
/fechou.php   #SERÁ EXECUTADO QUANDO A APLICAÇÃO SAIR DA MEMORIA RAM/CPU
/index.html

---

//fechou.php
<?php

$name = $_POST['name'];

file_put_contents("pessoas_que_fecharam.txt", $name);

---

//index.js
window.onbeforeunload = function () {
    return "Não será apresentado na tela";
}
window.onunload = function () {
    //essa evento é executado depois de window.onbeforeunload.
    //Quando a página é fechada, o navegador executa isso aqui(POST)
    //quando o post é executado, o navegador tira tudo da memoria RAM
    //e processador
    $.post("fechou.php", {name: "MARCELO"});
}

---

<!--INDEX.HTML-->
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript" src="index.js"></script>
</body>
</html>

First

When the user clicks to close the page/tab, window.onbeforeunload is executed and then a message appears asking if the user wants to leave or not. This is my window.onbeforeunload

window.onbeforeunload = function () {
    return "Não será apresentado na tela";
}

According to

When the user decides to leave the page, window.onunload is executed.

window.onunload = function () {
    //essa evento é executado depois de window.onbeforeunload.
    //Quando a página é fechada, o navegador executa isso aqui(POST)
    //quando o post é executado, o navegador tira tudo da memoria RAM
    //e processador
    $.post("fechou.php", {name: "MARCELO"});
}

when window.onunload is run/finished, the browser takes everything out of memory. And I should have a file called pessoas_quechamaram.txt with the name MARCELO within.

---

Sources:
https://developers.google.com/web/updates/2016/04/chrome-51-deprecations#remove_custom_messages_in_onbeforeunload_dialogs

https://stackoverflow.com/a/13443562/7173478

https://developer.mozilla.org/en-US/docs/Web/API/WindowEventHandlers/onunload