i want to clear local storage on tab close not on refresh
Is there a way to detect tab close event to clear the localStorage. I need localStorage to share data across tabs. window.onbeforeunload event works fine but it has 2 issues for me:
It also fires on page refresh which I dont want.
i also try windw.onCLose but not working.
I think its wise to use sessionStorage(window.sessionStorage) rather than localStorage because it automatically clears the data after closing browser or tab.
And for window.onbeforeunload, you can't prevent this event on page refresh.
Related
I want to clear the local storage when a tab is closed. If I use $(window).unload, it'll clear the storage also when the page is refreshed. Is there a way to do it only if a tab is closed?
If you're only looking to use this event to clear your localStorage, you might consider using sessionStorage instead. The difference is that the browser will handle clearing the data when the tab or window is closed (the data will be still be retained when refreshing).
How can I use javascript or AngularJS to detect the browser or tab closing and allow the user to prevent it through a dialog message?
I have an AngularJS app that saves data to session storage so that the user can refresh the page without losing their state and also have multiple separate instances of the app open in different tabs without having to sync data.
If the user closes the tab or browser then they lose their work in progress because the session is unloaded. I want to detect when the session is being destroyed and show a message to the user that informs them they will lose their work in progress if they proceed and allow them to select OK to continue closing the browser/tab or cancel to stop prevent it from closing. I only want to show the message on browser/tab close, not when the user hits the refresh button or navigates to a new page.
Note 1: I need to use session storage and not local storage because different tabs need to be isolated instances of the app and cannot share data.
Note 2: I've tried the unload and beforeUnload events but these don't work because they also fire when the refresh button is clicked or the user navigates away from the page. I only want to show the message before the session is destroyed, i.e. when the tab/browser is actually closed.
Note 3: This is a corporate app for internal company use and I know all the users and their use cases so I am not worried about annoying them with the popup message. I realize that preventing a user from closing the app would be a bad user experience on a public website but his is a very controlled scenario.
Ideally you could just use the beforeunload event lifecycle.. but as you mentioned you can't. From what I know, there is no other way to bind a method to a similar event.
That said, you might also want to reconsider your first note. You could create a hash for each new session, and store the session stuff under that key in localstorage.
I have some check boxes in one of my webpages, and this page has to refresh every 1 minute for some data consistency issues.
I am using window.sessionStoage to persist the check boxes that have been checked so that the user doesn't lose the boxes already checked on page refresh.
But I want to clear the sessionStorage when the user navigates away from that page (not necessarily leaving my website, might be going to another page on the same website), and for the same if I use the onunload event then the storage will be cleared in case of refresh also.
Is there any other event or any workaround that could help me achieve this.
May you try to save the path/name of the current page in you session-storage and on each init of your page check if the pagename equals the name in the sessionstorage. If not, you can clear it.
For your particular case window events can be in handy. So you can react to the blur and focus events, so leaving your browser tab will cause blur event.
$(window).blur(function(){
//clear session
});
$(window).focus(function(){
//maybe some code to re-init session data
});
I seen many post regarding same problem but i am not getting exact solution. i want to delete cookie on browser or tab close event using javascript. I have made delete cookie function and called on onbeforeunload event. But i seen that event also called when page refresh i dont want to delete cookie on page refresh. And i seen in many post that they are detecting link click, keypress event of F5 and form submit and in that they preventing onbeforeunload event. But then what about refresh button click and press enter at url bar. So i think this is not a exact solution. so help me out from this problem.
Further information is i am creating cookie using PHP and want to delete this cookie on browser close.
Cookies are automatically deleted when the browser is closed, unless you specify a lifetime for the cookie.
If you want to delete a cookie on browser close, better would be to check if cookie exists on page load and delete that.
To delete all the cookies when browser close uses the following code
$(window).bind('beforeunload', function(event) {
var cookies = $.cookie();
for(var cookie in cookies) {
$.removeCookie(cookie);
}
return true;
});
Hope this will solve your problem.
Trying to invalidate the session once click on the browser back button as well as browser close using jQuery.
How to capture the browser back button event and browser close event? Is there any advantage with respect to javascript?
Any help appreciated.
Hopefully this helps you:
http://api.jquery.com/unload/
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.