腐败与FileReader对象为FORMDATA [英] Corruption with FileReader into FormData
本文介绍了腐败与FileReader对象为FORMDATA的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我要建一个ajax文件上传,这可能要归功于新的 FORMDATA 接口。它的工作原理,如果我用的是原始文件,但如果我将文件转换为二进制字符串,然后到一个blob,生成的文件已损坏。我究竟做错了什么?
I'm building an ajax file uploader, which is possible thanks to the new FormData interface. It works if I use the original file, but if I convert the file to a binary string and then to a blob, the resulting file is corrupted. What am I doing wrong?
<!DOCTYPE html>
<html>
<body>
<form method=post enctype=multipart/form-data id=form>
<input id=file type=file name=file>
<button id=1>1</button>
<button id=2>2</button>
</form>
<script>
var d = document;
function $(id) { return d.getElementById(id); };
function xhr(fd) {
var x = new XMLHttpRequest();
x.open('post', '/', true);
x.send(fd);
};
$(1).addEventListener('click', function(e) {
e.preventDefault();
var file = $('file').files[0];
var fd = new FormData();
fd.append('file', file);
xhr(fd);
}, false
);
$(2).addEventListener('click', function(e) {
e.preventDefault();
var file = $('file').files[0];
var fr = new FileReader();
fr.onload = function(e) {
var bb = new (window.BlobBuilder ||
window.MozBlobBuilder || window.WebKitBlobBuilder)()
bb.append(e.target.result);
var b = bb.getBlob(file.type);
var fd = new FormData();
fd.append('file', b);
xhr(fd);
};
fr.readAsBinaryString(file);
}, false
);
</script>
</body>
</html>
斑点 BlobBuilder 的FileReader FORMDATA
编辑,包括链接
推荐答案
我把它工作在Firefox / Chrome浏览器由字符串转换成的 Uint8Array :
I got it working in Firefox / Chrome by converting the string into a Uint8Array:
var result = e.target.result;
var l = result.length
var ui8a = new Uint8Array(l)
for (var i = 0; i < l; i++)
ui8a[i] = result.charCodeAt(i);
bb.append(ui8a.buffer)
这篇关于腐败与FileReader对象为FORMDATA的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文