将input = file转换为byte数组

Lem*_*kin 4 javascript filereader

我尝试将通过输入文件获得的文件转换为byte [].我尝试使用FileReader,但我必须错过一些东西:

var bytes = [];
var reader = new FileReader();
reader.onload = function () {
   bytes = reader.result;
};
reader.readAsArrayBuffer(myFile);
Run Code Online (Sandbox Code Playgroud)

但最后,我的bytes var不满足字节数组.

我看到这篇文章:通过input type = file获取字节数组,但它不以byte []结尾,并且不推荐使用readAsBinaryString()

我错过了什么?

San*_* Ch 9

面对类似的问题而且其真实的'reader.result'不会以'byte []'结尾.所以我把它投射到Uint8Array对象.这也不是一个完美的'byte []',所以我不得不从它创建一个'byte []'.这是我对这个问题的解决方案,对我来说效果很好.

var reader = new FileReader();
var fileByteArray = [];
reader.readAsArrayBuffer(myFile);
reader.onloadend = function (evt) {
    if (evt.target.readyState == FileReader.DONE) {
       var arrayBuffer = evt.target.result,
           array = new Uint8Array(arrayBuffer);
       for (var i = 0; i < array.length; i++) {
           fileByteArray.push(array[i]);
        }
    }
}
Run Code Online (Sandbox Code Playgroud)

你正在寻找'fileByteArray'.看到评论,似乎你做了同样的,仍然想分享方法.


vap*_*guy 5

在我看来你只是想将文件放入数组中?这些函数怎么样 - 一个可以将其读取为文本,另一个可以读取为 base64 字节字符串,如果您确实想要数组readAsArrayBuffer缓冲区输出,我也将其包括在内:

document.getElementById("myBtn").addEventListener("click", function() {
  uploadFile3();
}); 

var fileByteArray = [];

function uploadFile1(){
  var files = myInput.files[0];
  var reader = new FileReader();
  reader.onload = processFile(files);
  reader.readAsText(files); 
}

function uploadFile2(){
  var files = document.querySelector('input').files[0];
  var reader = new FileReader();
  reader.onload = processFile(files);
  reader.readAsDataURL(files); 
}

function uploadFile3(){
  var files = myInput.files[0];
  var reader = new FileReader();
  reader.onload = processFile(files);
  reader.readAsArrayBuffer(files); 
}

function processFile(theFile){
  return function(e) { 
    var theBytes = e.target.result; //.split('base64,')[1]; // use with uploadFile2
    fileByteArray.push(theBytes);
    document.getElementById('file').innerText = '';
    for (var i=0; i<fileByteArray.length; i++) {
        document.getElementById('file').innerText += fileByteArray[i];
    }
  }
}
Run Code Online (Sandbox Code Playgroud)
<input id="myInput" type="file">    
<button id="myBtn">Try it</button>
<span id="file"></span>
Run Code Online (Sandbox Code Playgroud)