腐败与FileReader对象为FORMDATA [英] Corruption with FileReader into FormData

查看:156
本文介绍了腐败与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屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆