How to capture browser close and refresh events in different situations_javascript skills

When dealing with questions about members being online, we often have to determine whether the user is offline based on whether the browser is closed, and then remove the user from the session and application.

Since the browser is stateless, there will be two situations when capturing the browser closing:
1. Really close the browser (a. Click the close button b. Right-click the taskbar to close c. Press alt F4 to close)
2. Refresh the browser.

How to distinguish between these two actions?

1. Javascript code processing method:

Copy code The code is as follows:

function window.onbeforeunload()
{
//The user clicks on the upper right corner of the browser Close the button or press alt F4 to close
if(event.clientX>document.body.clientWidth&&event.clientY<0||event.altKey)
{
// alert("Click the close button");
document.getElementById("hiddenForm:hiddenBtn").click();
// window.event.returnValue="Are you sure you want to exit this page?";
}
//User click Right click on the taskbar to close. s or press alt F4 to close
else if(event.clientY > document.body.clientHeight || event.altKey)
{
// alert("Right-click on the taskbar to close");
document.getElementById("hiddenForm:hiddenBtn").click();
// window.event.returnValue="Are you sure you want to exit this page?";
}
//Other situations are Refresh
else
{
// alert("Refresh page");
}
}

where event.clientX mouse cursor X coordinate
document.body.clientWidth Form client area width
event.clientY Mouse cursor Y coordinate
event.altKey Whether the alt key is pressed
2. Event capture method:

Copy code The code is as follows:

Trigger the onbeforeunload event before the page is unloaded, if the user Select "Yes" to confirm that the unloading page will trigger the onunload event, otherwise the page will be returned without any operation.