0

Is it possible to stop all the requests/scripts that are happening on a page, when the refresh button is hit?
I have a $.ajax request that takes a few minutes. I have tried to do window.stop() in the unload event; I have tried xhr = $.ajax(...); and xhr.abort(); and any other methods found over the internet and nothing works.

Is this even possible? Why the browser still waits for that request to finish and send back a response and not refresh the page?


LATER EDIT (SOLVED): it seems that the waiting problem is actually from the server. If in the ajax call, the script uses the SESSION then the web page will freeze until the request is finished, even if we abort the xhr.

Why is that? Explanation:

Session data is usually stored after your script terminated without the need to call session_write_close(), but as session data is locked to prevent concurrent writes only one script may operate on a session at any time. When using framesets together with sessions you will experience the frames loading one by one due to this locking. You can reduce the time needed to load all the frames by ending the session as soon as all changes to session variables are done.

roshkattu
  • 241
  • 6
  • 22
  • If you have a ajax request taking multiple minutes you've done something wrong there already... – s1lence Jan 04 '13 at 18:40
  • 4
    The browser does not wait for existing AJAX requests. Your _server_ might be waiting (eg, for sessions) – SLaks Jan 04 '13 at 18:40
  • Calling `.abort` should stop the XHR from waiting for a response. What are you seeing that makes you say it doesn't work? – Frank van Puffelen Jan 04 '13 at 18:41
  • @s1lence I haven't done nothing wrong, it queries the Facebook API and YouTube API and has file_get_contents() on YouTub API over a hundred of YouTube videos. That's what the AJAX does – roshkattu Jan 04 '13 at 18:42
  • @FrankvanPuffelen When I hit refresh it still waits that AJAX load time ( about 1-2 mins ) and then it refreshes; If I get that piece of code out of the scripts.js file, it is reloading imediatly – roshkattu Jan 04 '13 at 18:42
  • maybe your ajax is being sent as a synchronous request? you've tried [this](http://stackoverflow.com/questions/446594/abort-ajax-requests-using-jquery)? here is [another question](http://stackoverflow.com/questions/7511342/is-it-possible-to-abort-a-synchronous-xmlhttprequest) about synchronous requests – vortextangent Jan 04 '13 at 18:42
  • @vortextangent yes I have tried both things :) and no result. Still waits for that piece of code to load – roshkattu Jan 04 '13 at 18:45
  • no sorry as an asynchronous but I believe that is default in jQuery so unless you are explicitly saying to us a synchronous request it should be proper. – vortextangent Jan 04 '13 at 18:47
  • @vortextangent it is async: true; I even set it to be sure. Also edited my post to see another try but didn't worked. – roshkattu Jan 04 '13 at 18:50
  • Can you create a self-contained reproduction of the problem on jsFiddler? – Frank van Puffelen Jan 04 '13 at 20:38
  • I will try to do that in a few moments. – roshkattu Jan 04 '13 at 22:26
  • @SLaks I am having a question: Why will the server wait? As far as I know things work like this: ajax requests accesses PHP file (CodeIgniter controller) > my server will open _a new thread/process_ that will run. So this means that **the browser won't** have to wait for that to complete. Am I right? – roshkattu Jan 04 '13 at 22:27
  • 1
    @roshkattu: Correct; the browser will not wait. However, if you use sessions, the _server_ (PHP) will wait. – SLaks Jan 06 '13 at 16:36
  • @SLaks yes, I found out now. I have done everything as needed. Thank you so much – roshkattu Jan 06 '13 at 18:58

1 Answers1

5

Maybe try canceling right before refresh as in here?

window.onbeforeunload = function(event) {
    xhr.abort();
};
Community
  • 1
  • 1
vortextangent
  • 561
  • 4
  • 16
  • Indeed this solved the _abort_ problem. Here is the _xhr.abort();_ result `XHR BEFORE ABORT: scripts.js:497 Object {readyState: 1} scripts.js:498 XHR AFTER ABORT: scripts.js:500 Object {readyState: 0, status: 0, statusText: "abort"} ` but the page still waits for the XHR to finish, and then reloads.. it seems that it is a server issue...as Slaks told me in a comment above – roshkattu Jan 04 '13 at 22:37
  • @roshkattu Ah, ok. So you just got rid of the session usage in the php file called by ajax and it works now? – vortextangent Jan 05 '13 at 02:53
  • @FrankvanPuffelen The code he showed made me think that the javascript interval was getting canceled when the page was refreshed so I wanted to make sure abort was in fact getting called. – vortextangent Jan 05 '13 at 02:53
  • 1
    @vortextangent Yes. In my ajax call I had the facebook SDK class that used the _session_. So after I got all the session vars needed from the FB Class I used session_write_close(); to get the session and make it read only. And now when I use the xhr.abort(); everything goes as planned. – roshkattu Jan 05 '13 at 03:16
  • 1
    @vortextangent To be more accurate, in the PHP Documentations of session_write_close(); it is told that: _Session data is usually stored after your script terminated without the need to call session_write_close(), but as session data is locked to prevent concurrent writes only one script may operate on a session at any time. **When using framesets together with sessions** (and xhr requests) you will experience the frames loading one by one due to this locking. You can reduce the time needed to load all the frames by ending the session as soon as all changes to session variables are done_ – roshkattu Jan 05 '13 at 03:20