beforeunload
não é usado para detectar quando as abas fecham ou janelas fecham é usado para detectar o "descarregamento" da página, ou seja este evento é disparado também quando você clicar em um link que vai pra outra página, pois a página atual será descarregada para poder carregar a nova.
Importante: Não tem como detectar a diferença de "maneira confiável" se está fechando ou paginando no evento beforeunload
.
O que você pode fazer é usar páginação com Ajax e o history.pushState
para mudar a URL, ao invés de paginações reais, no entanto o uso de beforeunload
com ajax também é problemático quando fechamos abas e janelas, leia a seguir.
Porque não é recomendado usar beforeunload
Note uma coisa muito importante, não recomendo usar beforeunload
pra detectar que a página fechou, pois isto não pode ser garantido, pelos seguintes problemas que a requisição ajax não poderá ser entregue pro servidor:
- Ao fechar uma aba ou janela todas requisições ajax são canceladas
- Pode ocorrer do navegador congelar ou fechar por causa de um erro (crash), então o ajax nunca será disparado.
- Por algum motivo o computador desligou repentinamente, por exemplo uma queda de energia.
API Beacon
Claro que existe a API Beacon que é semelhante ao XmlHttpRequest
(vulgo Ajax) que "garante" a entrega da requisição mesmo que a página seja descarregada (troque de página, feche a aba/janela), o que é diferente do XmlHttpRequest
que é cancelado se a página começar a descarregar acaso ele ainda esteja em processo de envio (de 0 a 2 no valor de readyState
geralmente).
Mas ainda que o Beacon pareça resolver muitos casos é preciso entender:
- É uma tecnologia EXPERIMENTAL
- Se o processo do navegador morrer abruptamente, acabar a energia e o PC desligar ou simplesmente estiver sem sinal de internet, isto nunca será entregue
Nesses casos o Beacon nunca vai entregar a requisição pro servidor.
Alternativa ao beforeunload
Como eu já disse nestes dois links:
O recomendo é criar um timer (assim como o Google faz, como citei no primeiro link), ou seja ninguém usa beforeunload
pois ele não é uma pratica boa pra este propósito especifico.
O timer deve ser criado no lado servidor e vai depender da linguagem que usa (no seu caso é o PHP), um exemplo que já citei no link acima seria, criar uma tabela:
id | login | senha | nome | lastactive
-----------------------------------------------
1 | test | test | João | 2015-06-24 01:00:23
-----------------------------------------------
2 | maria | maria | Maria| 2015-06-24 01:00:33
Supondo que eu seja o usuário de ID 1 (deve-se usar session) você teria que executar este comando a cada requisição "minha" (usando o php e o mysqli ou pdo):
UPDATE usuarios SET lastactive=CURRENT_TIMESTAMP WHERE id=1
E pra verificar os usuários online:
define('REQUEST_TIME', $_SERVER['REQUEST_TIME']);
define('TIME_ONLINE', 120);//120 = 2 minutos
function isOnline($timer) {
return REQUEST_TIME - strtotime($timer) > TIME_ONLINE;
}
$query = 'SELECT nome, lastactive WHERE 1 ORDER by nome';
if ($result = $mysqli->query($query)) {
while ($row = $result->fetch_assoc()) {
echo 'Usuário ', $row['nome'], ' está ',
(isOnline($row['lastactive']) ? 'online' : 'offline'), '<br>';
}
$result->free();
}
São apenas trechos de código para entender a lógica. Leia o link pra mais detalhes: Verificar se o usuário fechou o navegador
Qual o uso de beforeunload
Este evento foi criado pra poder executar funções voltadas a interações com o front-end (ou seja dificilmente irá trabalhar bem com ajax devido aos fatores já citados), como por exemplo prevenir que o usuário feche acidentalmente uma página que precisa estar aberta, como um jogo online, exemplo de uso:
window.onbeforeunload = function() {
return "Gostaria mesmo de sair desta página?";
};
Ao tentar fechar a aba janela ou trocar de pagina irá aparecer um alert com dois botões e a sua mensagem:
Documentação:
https://developer.mozilla.org/pt-BR/docs/Web/API/WindowEventHandlers/onbeforeunload