Aborting/Cancelling an AJAX request not working in IE

Question

I have an application where a user is allowed to upload and download documents. In the download area, the user can select multiple files (all pdf), and do a merge and download.

Great.

There is a modal window that pops up during the merge process, that shows the status of the merge, with a progress bar using SignalR. This works fine across all browsers, and the download happens.

Problem: There is a Cancel Merge and Download button on this modal. It stops the SignalR hub, and sends an abort() request to the AJAX call. This works in Safari, Chrome, and FF - but not IE.

When I look at Fiddler, Chrome stops the server side method in it's tracks. In IE, it tries to send that request to SignalR. The result in IE is that the modal window goes away as expected, but a few seconds later you receive the prompt that the file has been downloaded (actual processing never stops). Note the difference where the abort is called in the Fiddler session below.

Fiddler (Chrome - working):

Fiddler (IE - not working):

Javascript:

$('#cancelDownloadMerge').on('click', function () {
    $.connection.hub.stop();
    XX.Documents.DocumentsView.download.abort();
    XX.Documents.DocumentsView.mergeCancelled = true;
    XX.Documents.DocumentsView._isMerging = false;
});

The AJAX call that gets fired when Merge And Download is initially clicked is lengthy and proprietary, however, cache: false and crossDomain: true (since currently running localhost) are set as such, yet the problem still persists. I do not think the AJAX call is so much relevant as this is very much isolated to IE, but I can try and post more if needed.

I suspect this has something to do with the fact that Chrome and FF are using ServerSentEvents whereas IE is using forever frame (SSE not supported).

I'm stuck on this one, any help is greatly appreciated.

Answer 1

The problem was due to the fact that SignalR was always defaulting to using Forever Frame in IE. Adding the below restriction forced SignalR to use Long Polling in IE.

$.connection.hub.start({ transport: ['webSockets', 'serverSentEvents', 'longPolling'] });