2

I'm adding a file upload feature to an SPA application. The file uploads work flawlessly in the latest versions of Chrome and Firefox, but IE 11 intermittently (maybe 5%-10% of the time) fails to execute the XHR request. Inspecting the request with the F12 tools doesn't provide much useful information:

F12 Developer Tools with failed XHR request

The request stays in this "pending" state indefinitely.

Here's how I'm triggering the file upload (using jQuery):

function uploadFile() {
    var formData = new FormData();

    // filesToUpload is an Array<File>
    formData.append('file', filesToUpload[0]);

    $.ajax({
        type: 'POST',
        url: 'api/testupload',
        data: formData,
        contentType: false,
        processData: false,
        success: function() { ... },
        error: function() { ... }
    });
}

I've noticed this usually happens after letting the page site idle for at least a few minutes.

Once one POST upload request fails, all subsequent POST upload requests fail. However, if I execute a GET request after a failed POST, subsequent POSTs usually work. If I let the failed POSTs build up, the browser becomes unresponsive (usually happens after six or seven "pending" POST requests).

What could be causing this intermittent failure? Would switching to an <iframe> upload solve this issue? Is it possible this is problem is related to the network? Or how the server is responding? Or how I'm configuring and executing my request?


EDIT:

Here's the relevant parts of my document's <head>:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="cache-control" content="no-cache" />
    <meta http-equiv="expires" content="0" />
    <meta http-equiv="pragme" content="no-cache" />
</head>


EDIT: (again)

Using Wireshark, I'm able to see that the POST request with the file is being sent.

10
  • is the request done first via http or https? Sep 3, 2015 at 16:38
  • The request is done using HTTP. Sep 3, 2015 at 16:56
  • thanks,...can you also show some of your markup? at least the ones in the head Sep 3, 2015 at 18:38
  • Sure, I've updated the question to include <head> information. Sep 3, 2015 at 18:44
  • 2
    Not sure if it's the problem but on your HTML, the last <meta> tag has a typo. pragme should be pragma. Sep 12, 2015 at 11:59

2 Answers 2

1

I had a similar problem and the solution was to force the use of the older iframe file upload method.

My specific case: Using jquery file upload plugin (blueimp) on an application with SSO on IE11 results in PUT requests getting stuck in a pending state. If I log into my application without using SSO then ajax file upload works flawlessly. Also, like your situation, using a GET requests seems to refresh things and allow the next PUT file upload request to work. The fixed setting within this plugin is forceIframeTransport: true.

0
0

I had the same issue. SetTimeout mentioned in one of the comments above didn't help. The only way I could make it work was to use both cache: false and a GET request to a fake action after the failed POST. I was uploading the file sequentially, so it wasn't really possible to build up more than 1 failed POST. One thing to mention - the first failing POST didn't ever return an error, I could only catch is using a timeout. Here's the code for GET I used:

function reuploadChunk(fileNo, chunkNo) {
    $.ajax({
        url: "../SomeController/FakeAction/",
        type: 'GET',
        cache: false,
        success: function () {
            uploadChunk(fileNo, chunkNo);
        },
        error: function () {
            setTimeout(reuploadChunk(fileNo, chunkNo), 1000);
        }
    });
}

It's more of a workaround than a solution, but the good thing is people will soon move to Win10, so IE11 won't be a problem anymore.

NeatUpload seems to work in IE11 if you'd like to use a library, but it's super old, so I wouldn't really recommend it.

1
  • on W10 and Edge: there still the same issue. However on IE 11 as well as on Edge, the console retunrs "pending". In the reality, the file is fully uploaded. But without any indication of it :-/ Jul 25, 2019 at 9:14

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.