I want to restrict the page refresh only when we doing this by clicking the refresh icon at the top left side of the browser.
I have tried more available options like,
'beforeunload' event, which can fire on each time of unloading(refresh, navigation, close) the browser.
Inside the event, I have tried 'window.performance.navigation.type' and window. performance.getEntrieaByType('navigation').map(nav=>nav.type) options. But both aren't giving the correct result. On each actions like "refresh", "navigation" and "close" getting the same result. Also sometimes getting different result. So I amn't trusting the options.
So can anyone help me to get the correct option to detect the refresh action done by browser refresh icon?
I am using react application.
window.onbeforeunload = ()=>{
localStorage.setItem("unload",Date.now());
}
useEffect(){
let last_unload = localStorage.getItem('unload');
let decided_time = 1000;
if(last_unload){
// means the user have closed the page
if(Date.now() - parseInt(last_unload,10) <= 1000)
{
// this is a refresh
console.log('refresh handling code')
}else{
// It's a new session, means user came to page, closed the browser, now came back after a long time
}
}
}Generally the answer from here
should work but because you are stating that window.performance is ambiguous in your case try something like this. Let me know if this helps!