Firefox XHR未触发上传进度事件 [英] Firefox XHR not firing upload progress events
问题描述
相当简单的HTML / JS：
Pretty straight-forward HTML/JS that:
- 使用Base64编码的PNG
- 将其转换为blob
- 设置一个img.src以验证它是否有效PNG
- 设置事件处理程序后，通过XHR上传它
-
- Takes a Base64-encoded PNG
- Converts it to a blob
- Sets an img.src to verify that it's a valid PNG
- Uploads it via XHR after setting event handlers
在Firefox 12中，我收到了 loadstart 和加载事件，
In Firefox 12 I get the "loadstart" and "loadend" events but no "progress" events.
在Chrome 20中，一切都正常。
In Chrome 20 everything works fine.
这个文件名为image.html，所以它只是上传到自己进行测试。
This file is named "image.html" so it just uploads to itself for testing.
我还尝试设置一个内容第一个标题，但没有更改结果在Firefox中，所以我评论了。
I also tried setting a content-legnth header but that didn't change the results in Firefox so I commented it out.
任何人都可以验证相同的结果？我错过了什么吗？
谢谢
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<script>
var testPng64 = 'iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAXUlEQVR42rVTgQkAIAjz+P4uggKjTU0pEGLopkxFWu9SepMgS3LUMRImAHEN7r+OUNeowMKfW3bVEUloBCuJdWQDztz/CZClYYKIInTC89m0EW0ei9JBXbnZa1x1A1Sh2i/qfsVWAAAAAElFTkSuQmCC';
function receiveImage(pngBase64) {
console.log("receiveImage");
var img = document.getElementById("webImg1");
var BlobBuilder = window.MozBlobBuilder || window.WebKitBlobBuilder || window.MSBlobBuilder || window.BlobBuilder;
var bb = new BlobBuilder();
var byteString = window.atob(pngBase64);
var ab = new ArrayBuffer(byteString.length);
var ia = new Uint8Array(ab);
for (var i = 0; i < byteString.length; i++) {
ia[i] = byteString.charCodeAt(i);
}
bb.append(ab);
var blob = bb.getBlob("image/png");
var URL = window.URL || window.webkitURL;
var imgUrl = URL.createObjectURL(blob);
img.src = imgUrl;
upload(blob);
}
function upload(blob) {
console.log("upload");
var xhr = new XMLHttpRequest();
xhr.addEventListener("load", function(e) {
console.log("xhr load");
});
xhr.upload.addEventListener("loadstart", function(e) {
console.log("xhr upload loadstart");
console.log(e);
}, false);
xhr.upload.addEventListener("progress", function(e) {
console.log("xhr upload progress");
console.log(e);
}, false);
xhr.upload.addEventListener("loadend", function(e) {
console.log("xhr upload loadend");
console.log(e);
}, false);
xhr.open("POST", "image.html", true);
//xhr.setRequestHeader("Content-Length", blob.size);
xhr.send(blob);
}
</script>
</head>
<body>
<div>
<img id="webImg1" src="about:blank" width="64" height="auto"/>
<progress id="progress1" min="0" max="100" value="0" style="width: 64px;">0%</progress>
</div>
<div><button onclick="receiveImage(testPng64)">Load</button></div>
</body>
</html>
推荐答案
Firefox使用的网络库不会将上传进度公开消费者（如Firefox所说），所以Firefox目前无法触发上传进度事件。
The networking library Firefox uses does not expose upload progress to consumers (like Firefox, say), so there is no way for Firefox to fire upload progress events at the moment.
编辑：看起来像我错了;显然，我记住了一段时间以前存在的代码。所以然后我试过上面的测试用例...在Firefox 12中，它的行为如上所述，但在当前的夜间，它会触发上传进度事件。
Looks like I was wrong; I was remembering code as it existed a while ago, apparently. So then I tried the testcase above... in Firefox 12 it behaves as described, but in a current nightly it fires an upload progress event.
这篇关于Firefox XHR未触发上传进度事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
