Develop Reference

call different function during page refresh and close javascript

I am creating a web app using web socket, which on user closes the tab I will make an API call to the server to clean the user related info in the server, I used onBeforeUnload listener in javascript, but this method also gets triggered during the page refresh.
I need to trigger a method only during the tab or browser close, but not during the page refresh.
I know this question has been asked several times, some solution suggested using cookies will not be helpful in my case

navigator.sendBeacon() method can be used for sending data from browser to server when a tab is closed.
Here is an example:
window.addEventListener("unload", function informServer() {
navigator.sendBeacon("/server-api-to-collect-data", my-data)
})
More information:
https://developer.mozilla.org/en-US/docs/Web/API/Navigator/sendBeacon

As far as I know, you can not listen to actions of browser's tab close or exits. For your application it is an "unload", whatever caused it...
The only thing I could think about is maybe add a listener for keyboard key press (F5), however it doesn't help in case someone refreshed by clicking on the browser's refresh button.
I don't know what is the use case, but most of the things should be done when a page unloads (no matter why) and/or when the page is back up again. So most of the solutions are for situations where your page is loaded again - and then you can determine what was the source of the load and make farther actions, but since you have an option were someone can close and never come back, that might not be the case.
Some solutions for page load up:
You can use Navigation type.
You can check referer.
You can use cookies or other types of browser storage.
I would recommend to rethink about your use case. Maybe you can do whatever you want on load up or leave it on onBeforeUnLoad without knowing the future :)

Reloading page without browser knowing

I currently am building a website that fetchs data from MySQL with php and then displays it. On one of the pages I use a form to submit data and then I reload the page to display it. It does it's job fine and works exactly as I want the only problem is when a user presses the browser back button it goes through all previously submitted data instead of just going back to the page it came from. Is there a way to reload a page without the browser storing it or is there a way to make the browser go back to the previous page instead of history.
NOTE: I am aware of Ajax and how to use it to not reload the page at all but I wanted to see if there was a way to do it without redesigning my whole page with a seemingly small problem.

You can use history.replaceState in HTML5.
Another possibility appears to be
window.onpopstate = function(event) {
window.history.go(-1);
};
although I have not tried this myself.
See https://developer.mozilla.org/en-US/docs/Web/API/History_API and https://developer.mozilla.org/en-US/docs/Web/API/WindowEventHandlers/onpopstate

Refresh button now not working

I made a simple refresh button that used to work, and when I say 'refresh' i mean refresh to the current page (clearing data) and not a 'backspace' button that goes to the previous page.
onClick="window.location.reload()"
history.go(0)
window.location.href=window.location.href
I usually use one of these to refresh my search function to clear the data for a new search, just by refreshing the page, but all of a sudden I am getting a previous page instead. I am not sure why. I was testing on chrome. The problem is the way it is now the previous page could be anything, including something offmy site like google search ect.
Has anyone any idea what i am doing wrong?
I also tried
window.location.reload(true)
and
window.location.reload(false)
but I seem to be going around in circles.

<button onclick="window.location.reload(true);">Click me</button>
The "window.location.reload();" is javascript, to check if an error is occuring when you run this page press f12 to view your browser tools and move to the console then attempt to reload your page, any javascript error will appear there.

Stop or Disable browser Refresh button in javascript

I work in Ext JS. in Ext JS webdesktop application , when i click browser refresh button it reload and goes to login window. Because my first page is login. For this reason i need to stop this event or disable browser refresh button when this application launch. i can stop F5 but can't browser refresh button. So please some one help me for this issue.
Thanks...

No, wrong issue
You have to memorize the current View he is in. As far as i remember, Ext has mechanisms for that, otherwise you can still use a (session-)cooke.
and you don't have to start you application with the login-screen. It is just one view, and imo. the one you would want to use as few as possible.
So. on page load, check wether he is logged in, if no, show him the login-view, if yes check which view he was in and render it, otherwise send him to the start point.
this is basically the loop you have to send him through, on pageload, on refresh, onlogin, ...

How can I get links to a redirect page to show up in the browser's history?

A website contains a "random" link, which loads a url that returns a 307 redirecting to the url we want. It works fine: click it and you load a random page. The problem is that each time you click it, the browser assumes you're loading the same page: so if you're on the homepage, then you follow the random link 5 times, then you press back, you'll be taken all the way back to the homepage, with no way to find the random pages you were just looking at. I want to modify this behavior so that users can access previous random pages via the back and forward buttons.
I don't own the website, so I can't just change the redirect code.
Here's what I've tried, all of which has failed.
Predicting what would be redirected to. While somewhat possible, there would be no way to avoid failure in up to .1% of clicks, and it would react very poorly to unexpected events, like a page that's published a day late, let alone a sit structure change.
Loading the 307 page via ajax. The request stops at readystate == 2 and I can't access the location header.
Cancel the click event and instead set location.href = random_link.href. This has no effect - the new page still doesn't go into history.
Have the new page call history.pushState. This successfully adds the page to history, but I can't find a way to distinguish between new pages and ones being opened via the back button, so the history quickly becomes very corrupted.
Keeping my own history in localStorage. As above, I can't tell when the back button is being used.
I'm working on a solution that I'm pretty sure will work, involving loading the page in an iframe over the existing page and using a background process and messaging to work around the fact that content injections from chrome extensions can't access window.parent from within iframes. And using the history API to reflect the current iframe's URL in the address bar, and get the back and forwards buttons to apply to the current iframe where appropriate.
While I'm pretty sure the last solution can be made to work, it's a hideously complex and heavyweight approach to what seems like a simple problem. So I thought I'd ask you guys before I continue: any other ideas?

Have you tried storing the locations in localStorage, then hi-jacking the back button ?
I am sure you know how localStorage works, for hi-jacking the back button you can refer to this : Is there a way to catch the back button event in javascript?
T.