On browser close or F5, I have to perform some code on server side
For this I have a button. On click of that button which has onclientclick and onclick functions written. I also wrote an event on window.onbeforeunload which does a button.click().
window.onbeforeunload=function(e)
{
button.click()
}
My problem is that this runs the code of the client side click function of the button, however server side code does not get executed. This happens only when i close the browser. When I do F5 it works perfectly. Also this happens only on Safari. In FF and mozila it works perfectly . How can i
Safari does not allow or execute asynchronous AJAX requests in beforeunload events, so it might very well be that your code is executed but that the requests are never issued to the server. Synchronous AJAX requests are executed, so use those in the beforeunload handler.
There is probably a speed issue, the button gets clicked but the response isn't being sent to the server fast enough, so the browser closes before it can be sent.
If you need to, you can always throw up a prompt to slow the closing of the window down, but this is very unfriendly.
as a curiosity, The problem here is taht Safari does not recognize the onbeforeunload event... therefore any code there will not be run in Safari.
You could use onunload event but here you will never be able to prevent the page from closing
Related
I'm attempting to run a function (that sends some fetch calls to an API) inside of a "beforeunload" event handler and the results are mixed. With Chrome it successfully runs my function if the user reloads the page or clicks a link for a different webpage, but it doesn't work if they close the tab. In Firefox the function only runs if they close the tab, but not in any other scenario. When I debug the beforeunload handler in the browser I can see the event handler clearly is triggered but the function inside doesn't always run. I suspect the function I'm trying to feed being async is part of the issue but I don't know why the results would be so inconsistent?
This is how I'm currently writing the event handler
window.addEventListener('beforeunload', async function(evt){
await exitChat();
});
I've also tried not using async/await. Let me know if seeing the exitChat() function code would help or anything else.
Edit: After a bit more debugging I can confirm that the issue, with Chrome at least, is that when the window is closed it can't make it through the entire exitChat() function in time before the page closes. So is there a way to force a delay in the unloading process?
I have a seemingly simple requirement but I have been stuck for days. Can someone give me a hand?
I need a confirmation prompt if the user tried to close the pop-up window
if the user click ok to close, I need to call an ajax call
My original design is to add an onbeforeunload event handler, have it returns a string which triggers a prompt. Works perfectly.
The problem is the next part. Added a unload listener, a pagehide listener, and a visibilitychange listener - in all three cases, Chrome doesn't fire the event if the user close the window, only if I refresh the window. Firefox works perfectly. I am using a sendbeacon call which should work in these scenarios and if I add a breakpoint to pause before the window closes, the beacon is sent, so it seems like Chrome is closing the document too fast and never bother sending the last beacon, which makes the whole exercise pointless.
Has anyone face similar issues and if so, any way to work around it?
I'm struggling with the same problem.
Reading about the event on the documentation I've noticed that it is an unstable event, and moreover in the compatibility table, Chrome is set to "not supported".
But I noticed that chrome fire the event one time only.
If I close the browser and then i re-open it, the first time the event is fired, but it not work with tab closing.
Context :
I have developped an application which require authentification. This application uses events for dialoging with a server. When the server answer, some events are send to the client (UI).
Problem :
When the user close the page, it is necessary to make a logout on the server. With my architecture, it's easy to call a method which perform this logout. But i would like that the user show the logout progress before closing the webpage. In fact, i would like to close the webpage only when a specific event (for example : disconnection_success), is well received.
Moreover, it's verry important to not launcg another webpage because event is received on the first webpage when the logout is successfull. (Because dialog is done throw XMLHttpRequest)
Test :
I already do some test using onbeforeunload but it seems that is difficult to customize the popup.
Do you have some ideas to resolve the problem ?
BR
There are some issues with this, but you're on the right track. You're right in that you should use onbeforeunload because it is the only event that you can have triggered upon the closing of the browser window. (I know you can use onunload but at that point you have no time to do anything.) The issue here is how much code do you want to execute. The onbeforeunload doesn't allow you much time before it starts to unload the page.
BTW, there are two different scenarios with onbeforeunload:
If you return a string inside the onbeforeunload event, it creates the pop-up that you were referring to. The issue here is that with the pop-up, you won't have enough time to execute code
The other option is not returning anything. Instead, call your logout methods. This should give your code enough time to execute before closing
I actually had a question very similar to this and ended up solving it myself: How to logout during onbeforeunload/onunload using Javascript
In your question you state that you want to have a progress bar displayed when they log-out. This is impossible to do when the user closes the browser. At the moment they close their window, you have lost all control, except for in the onbeforeunload (and onunload but don't use this), and that is why your code needs to be executed there. With that being said, you could anchor your logout button (I'm assuming you have one on your application) and have it display the progress bar.
Just think about what could happen if you actually did have that kind of control - where you could pop up windows and progress bars when the user is trying to close their browser window. You could pop up anything and restrict the user from having any reliable functionality. That is why it was programmed that the onbeforeunload (and unload) events are the only ones possible to access the closing of a browser. These events have some pretty strict guidelines to them that prevent any kind of possible mis-use. I understand the problem you're having, I was there and it stinks, but I think that is your only option if you were going to use onbeforeunload.
when a user closes their browser or refresh the browser(onbeforeunload event does NOT fit for my scenario, seems user may cancle to leave), I want to send a log to server, so I have the following code, it works fine in chrome and FireFox, but NOT work in IE8+:
window.onunload = function(){
$.ajax({url:"http://localhost:8888/log",async:false})
};
Try using onbeforeunload event
https://developer.mozilla.org/en-US/docs/DOM/window.onbeforeunload
I want to fire onunload event to do some clean up operations, I have multiple tabs(Navbar) showing multiple links to different web pages,my problem is that even when I'm in some other page my unload function which is in tag of some other jsp is fired. Please help to resove this, I want unload function to be called when user closes browser in that page.
I'm not sure how you got the onunload event to work....The problem I've found with using the onunload event is that it is fired after the page has been unloaded. This means that no more JavaScript can be executed because the page has been unloaded.
You should be looking into using the onbeforeunload event.
This event is a little unique because if the function that handles this event returns anything a pop up is displayed asking the user if they would like to continue with the operation. So, in your case make sure that your function doesn't return anything. The other thing to note about the onbeforeunload event is that, at this time, Opera does not support it (Safari, FireFox, and Internet Explorer do though).
Both the onbeforeunload and onunload events are executed every time the page is unloaded. If a control on your page submits the page to the server code, the page is unloaded and the JavaScript is executed.
If you don't want the JavaScript to be executed when a control on your page is submitting it to the server you have to implement something that checks to see whether or not your code should be executed.
This is simple, add a JavaScript boolean to the page and a function that set's this boolean to true. Make sure that every element in your page that posts back to your server code sets this boolean to true before it submits the page. Check this boolean in your onbeforeunload event to see if your cleanup code should be executed.
Hope this helps,
-Frinny
It seems that the unload function has been created in a global scope. Try placing that function only on the page you want to act.
You have a frameset page? And you want to be notified when they navigate away from the frameset? Add an onbeforeunload on the frameset. I don't know what you mean by clean up, but you can't send XHRs during unload safely across browsers