当发送带有 async = false 的 XMLHttpRequest 时,xhr.upload.onprogress 事件永远不会在文件上传时触发。
来源:
var form = new FormData();
form.append("name", files[i].name);
form.append("size", files[i].size);
form.append("type", files[i].type);
form.append("image", files[i]);
var xhr = new XMLHttpRequest();
xhr.upload.onprogress = function(evt){
alert("Progress event fired!");
if (evt.lengthComputable)
{
var percentComplete = (evt.loaded / evt.total)*100;
console.log(percentComplete);
}
};
xhr.onload = function() {
console.log(files[i].name + " uploaded!");
};
xhr.open("post", "/images/upload", false);
xhr.send(form);
我已经在 Firefox 和 Chrome 中测试过了。
我不知道我是否遗漏了一些文档,但找不到任何表明当 async = false 时没有触发 xhr.upload.onprogress 事件的内容?
如果我将请求更改为使用 async = true 运行,它就会被触发。
最佳答案
基本上您不应该使用同步请求,尤其是在文件上传中,这可能需要一些时间。
使用同步请求,您可以阻止线程执行,直到一切都完成(文件已上传),即使 onprogress
事件已经被触发,您也可以不更新任何进度条,因为 UI 和所有其他处理(但文件上传)将被阻止。
创建这些事件是为了让您可以处理异步请求。
如果您阅读 here ,您会看到同步请求在某些浏览器版本中已被弃用。
关于javascript - XMLHttpRequest onprogress 不触发异步 = false,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26449106/