Xhr 上传 event.loaded 问题答案

【问题标题】：Xhr uploading event.loaded issueXhr 上传 event.loaded 问题
【发布时间】：2013-06-28 17:25:15
【问题描述】：

opts.xhr=function(){
    var xhr = new window.XMLHttpRequest();

    // Upload progress
    xhr.upload.onprogress = function(e) {
        if (e.lengthComputable) {
            var percentComplete = e.loaded / e.total * 100;
            console.log('Progress info:', e.loaded, e.total, Math.round(percentComplete),  Math.round(e.loaded/1024/1024), Math.round(e.total/1024/1024));
        }
    }
    return xhr;
}
return $.ajax(opts);

进度信息：53657600 2666153229 2 51 2543

进度信息：55656448 2666153229 2 53 2543

进度信息：57655296 2666153229 2 55 2543

进度信息：59850752 2666153229 2 57 2543

进度信息：4489216 2666153229 0 4 2543

进度信息：4800512 2666153229 0 5 2543

WTF?!

为什么会跳回来？显示 59850752 已加载，然后 4489216。O_o 我做错了什么？

请求网址：http://mydomain.com/admin/upload?callback=jQuery18307878572104964405_1372440424301

请求标头

Accept:text/javascript, application/javascript, application/ecmascript, application/x-ecmascript, */*; q=0.01
Content-Type:multipart/form-data; boundary=----WebKitFormBoundaryVHTBFWPenOcByyrT
Origin:http://mydomain.com
Referer:http://mydomain.com/admin/add
User-Agent:Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/27.0.1453.116 Safari/537.36
X-Requested-With:XMLHttpRequest

查询字符串参数

callback:jQuery18307878572104964405_1372440424301

请求负载

------WebKitFormBoundaryVHTBFWPenOcByyrT
Content-Disposition: form-data; name="images[]"; filename="smerch_BDRip-AVC.mkv"
Content-Type: application/octet-stream


------WebKitFormBoundaryVHTBFWPenOcByyrT--

【问题讨论】：

也许更多关于您的情况的信息会有所帮助。
您需要什么信息？我不是把我得到的都发了吗？ O_o
哪个浏览器？哪个操作系统？所有文件或一个特定文件都会发生这种情况吗？请求最终成功了吗？等等等等。
更新了问题。 2 分钟后，请求因超时而被丢弃。我会尝试不同的文件。
所有文件/请求都会发生这种情况，还是仅发生一些？这真的是 2.7 GB 的请求吗？您是否尝试过在其他浏览器上重现？

标签： javascript ajax upload

【解决方案1】：

经过一番调查，我发现问题在于您的后端在没有响应的情况下断开连接，并且 Axios 尝试重新上传数据（有时会抛出“网络错误”）。

解决方案是检查客户端和后端服务器之间的代理/防火墙配置，并延长超时和允许的主体大小

例如对于 Nginx

client_max_body_size 3G

【讨论】：