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
Related
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!
This question already has answers here:
JavaScript, browsers, window close - send an AJAX request or run a script on window closing
(9 answers)
Closed 6 years ago.
I am working on a website, where at a time one admin can login. I implemented this by saving value in database. Now the problem is when current admin forget to logout, the value in database do not change and another admin can't login again. Even this current admin can't login later on, cause the value in database is checked in condition.
I have looked in window.onbeforeload and window.onunload functions, but it only trigger on page refresh etc, not detecting browser close tab/window. I want to detect closing browser tab and call function upon close, so I can change value in database using ajax.
Any help will be appreciated! Thanks
The event you are looking for is onbeforeunload
Use window.uneforeunload which is trigged when tab/window is closed.
Updated
window.onbeforeunload = function (){
// update your database from here before page closed
}
DEMO
This question already has answers here:
Closed 11 years ago.
Possible Duplicate:
javascript detect browser close tab/close browser
Does anyone know a reliable way to listen out for a window closing event in javascript/ jQuery?
The window is the parent and not any child instances. I.e. if a window is closed by mistake and the visitor launches their browser again and loads the url previously visited once more.
You can use the window.unload event to set a cookie or use local storage to save the time using new.date(), then see if the visitor returned within a set amount of time.
Something like:
$(window).unload(function() {
localStorage.setItem(“theyLeft”, new Date());
}
then on load check for :
$(window).load(function() {
var timeGoneBy = new Date() - localStorage.getItem(“theyLeft”);
//calculate time gone by, and do something if visitor returned within given time etc.
}
Would need to be refined a lot, and local storage should have cookies as fallback, but just to show the jist of it.
Try the unload method.
The unload event is sent to the window element when the user navigates
away from the page. This could mean one of many things. The user could
have clicked on a link to leave the page, or typed in a new URL in the
address bar. The forward and back buttons will trigger the event.
Closing the browser window will cause the event to be triggered. Even
a page reload will first create an unload event.
You can also try playing with the JS onunload and onbeforeunload events.
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.
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!