How to distinguish Unload Event triggered by Refresh or Window Close? - javascript

Unload Event can be triggered both by Refresh action and Window Close action. is there a way to distinguish which action that actually trigger it? In my situation, i want to ignore the Refresh action. Could you please give me some insight what the work around is?
I noticed that there is already this sort of question asked, but it seems to they are all unresolved. Therefore i came up this question again and hopefully some intelligent guy can solve this problem.

I do not believe the browser can distinguish between the two events.
Both are an unload event, and both will call any unload function that you have made.

Related

Trigger an event only on page close [duplicate]

This question already has an answer here:
javascript beforeunload detect refresh versus close
(1 answer)
Closed 1 year ago.
I am trying to trigger a function in my vue.js app only when the user closes the app. I already found the possibility to register an event listener for beforeunload. Using this event, the function will also trigger when the page is just reloaded - which is not really what I want.
Can anybody tell me if there is a way to prevent beforeunload from triggering on refresh? Or is there a completely different way to fire a function whenever my page is closed?
Thank you in advance! :)
I don't think there is a way to differentiate between a refresh and a page close, but you can maybe set a timestamp in local storage and then check that timestamp on load and if it's close you can assume it was a refresh. The before unload will still run though, but maybe you can write some js to undo whatever the before unload did when it was a refresh.
Edit: This answer to a similar question may also be helpful:
https://stackoverflow.com/a/14893469/5460296

How to detect browser (not window) close event

I want to detect browser close (not the window(tab)) and run a script. I tried onunload and onbeforeunload but they are working fine with tab close but if I close entire browser nothing happens. How can I do this?
EDIT:
I just want to do a server side cleanup on any these kind of event. Is there any way to do that?
Based on the question as asked, 'how can I [access the browser-close event]?' the only possible answer is: you can't; it's not possible. Nor, for security reasons, should it be.
I want to do a server side cleanup for any this kind of event. Is there any possible way to do it?
The only way I could think of, with JavaScript, is trigger an Ajax call to a server-side script notifying it of the close-event, using onunload or onbeforeunload, and having that script tidy up any sessions that might still be open.

What user actions trigger beforeunload in which browsers?

closing window
refreshing page
clicking on a link
??
It seems to be inconsistent. (I'm shocked!) Is there a list somewhere? I'm particularly interested in Firefox, but am curious about others, as well. The Mozilla docs are vague:
window.onbeforeunload
An event that fires before the unload event when the page is unloaded.
window.onunload
The unload event is raised when the document is unloaded.
Gee, thanks.
window.onbeforeunload will trigger before you navigate to away from current page (from URL address, BACK button, close browser, etc.)
The event will not fire in Opera. But all the other browsers seem to respect it OK.
I have used this in the past for AJAX-intensive sites, mostly as a way to avoid having to support the BACK button.
It also works well as a confirmation dialog to prevent you from accidentally losing your work. But users might get annoyed by the confirmation. So this might not be a good enough reason to use it.

How can I get reason of page unloading in javascript's onunload event, in IE?

There may be different reasons of page unloading:
1 User closes the current window.
2 User navigates to another location.
3 Clicks the Back, Forward, Refresh, or Home button.
4 User submits a form, and then browser starts to unload current page and load page with results of form submitting. (Assuming that the current window is the form's target).
5 and so on...
Can I somehow know in onunload handler that the reason of unloading is p.4, i.e. moving to page with results of form submitting?
I could define some flag when submiting form, but this does not solve the problem. Because response (on form submit) from web server takes some time, browser doesn't unload the current page immediately and waits response from server. And during this waiting user may close window or navigate anywhere. And I need to know whether was it indeed moving to results page or something else...?
You could hijack some of those events.
For example for links, you could add an event handler on links that saves their href attribute, performs what you require, then sets window.location to the href you had stored in a variable.
The exact reason of page unload cannot be known in the unload handler. OnUnload event is not a standard and was implemented by IE first.
Different browsers might handle it differently and fire the event for different cases.
msdn reference
mozilla reference
So if you are trying to know the reason of unload in the unload handler, I think you might be out of luck. However as Alex pointed out in his answer, you could probably know about user navigating away from your page by clicking some link on your page by making your click handlers for those links more intelligent.
on unload cant handle its looks like but maybe when load you can handle.
as explained
performance.getEntriesByType("navigation")[0].type
You can check this Link
What is the replacement for performance.navigation.type in angular?

Is there a way in javascript to detect if the unload event is caused via a refresh, the back button, or closing the browser? [duplicate]

This question already has answers here:
Identifying Between Refresh And Close Browser Actions
(13 answers)
Closed 6 years ago.
I am currently looking at the "unload" event of a window to try to determine how the "unload" event was triggered, but am having little success. Is there a way to determine how the javascript event was triggered?
Page Refresh
Back Button (or navigate away from the page)
Closing the Browser
Essentially I need to execute some code only when the browser window is being closed, not refreshed or navigated away from.
Purpose: When a customer does an update of our software, the update will redirect their first Internet request to an offer page. There is a button for a "Do Not Bother" option, but some users will simply close their browser. Upon closing the browser, I need to duplicate the "Do Not Bother" functionality so the user no longer gets redirected to the offer page. Simply attaching to the "unload" event will not work due to the different ways of leaving a page.
No, and if there was it would be browser dependent.
What kind of code are you trying to run when the user closes the page?
Is it to logout the user?
Then the user would not be logged out if the browser crashes or the network connection breaks (and probably not if the computer goes to sleep/hibernation mode).
If it is for logout-purposes you should probably use a timestamp variable at the server that gets updated with every request (or use a ajax-ping), and logout the user if it hasn't been seen for a specified time.
Update: Found this answer here at stackoverflow.
Yes, there is a solution!
I've designed a solution based on onBeforeUnload+onLoad events, HTML5 local storage and client/server communication. See the details on https://stackoverflow.com/a/13916847/698168.
I use a method of doing keyboard "sniffing", in that it looks for keydown's of "F5", "ctrl+r", "alt-f4", "backspace" and others, and if it finds them flowing through the keyboard event queue, it sets boolean variables appropriately to trap that status... then I use a "onbeforeunload" function handler, which tests against those boolean status variables to decide what to do.
You can even shut down various keyboard strokes (like "ctrl+n" or "F1" for instance) by using preventDefault(), bubbles=false and returnValue=false in your keyboard handling.
This stuff is not for the faint of heart, but its certainly doable with some persistence and lots of cross browser testing!

Categories