IE11中的间歇性AJAX文件上传失败 - F12工具无限期显示“待定......”

时间:2015-09-03 16:22:08

标签: javascript ajax internet-explorer file-upload internet-explorer-11

我正在为SPA应用程序添加文件上传功能。文件上传在最新版本的Chrome和Firefox中完美运行,但IE 11间歇性地(可能是5%-10%的时间)无法执行XHR请求。使用F12工具检查请求并没有提供太多有用的信息:

F12 Developer Tools with failed XHR request

请求无限期地处于此“待处理”状态。

以下是我如何触发文件上传(使用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() { ... }
    });
}

我注意到这通常发生在让页面网站闲置至少几分钟之后。

一个POST上传请求失败后,所有后续POST上传请求都会失败。但是,如果我在GET失败后执行POST请求,则后续的POST通常会正常工作。如果我让失败的POST成立,浏览器就会无法响应(通常在六或七个“待处理”POST请求之后发生。)

什么可能导致这种间歇性失败?切换到<iframe>上传是否会解决此问题?这可能是问题与网络有关吗?或者服务器如何响应?或者我如何配置和执行我的请求?


修改

以下是我的文档<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>


编辑:(再次)

使用Wireshark,我可以看到发送文件POST请求

2 个答案:

答案 0 :(得分:1)

我遇到了类似的问题,解决方法是强制使用旧的iframe文件上传方法。

我的具体案例: 在IE11上使用SSO的应用程序上使用jquery文件上载插件(blueimp)会导致PUT请求陷入挂起状态。如果我在不使用SSO的情况下登录我的应用程序,那么ajax文件上传工作完美无瑕。此外,与您的情况一样,使用GET请求似乎可以刷新内容并允许下一个PUT文件上载请求起作用。此插件中的固定设置为{{1}}。

答案 1 :(得分:0)

我有同样的问题。 上面其中一条评论中提到的 SetTimeout 没有帮助。 我能使其工作的唯一方法是在POST失败后使用 cache:false 和对假动作的GET请求。 我是按顺序上传文件的,因此不可能构建超过1个失败的POST。 有一点需要提及 - 第一个失败的POST没有返回错误,我只能抓住使用超时。 这是我使用的GET代码:

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

它更像是一种解决方案,而不是一种解决方案,但好处是人们很快会转向Win10,因此IE11不再是一个问题。

NeatUpload似乎可以在IE11中使用,如果你想使用一个库,但它已经超级老了,所以我不会真的推荐它。