通过输入类型=文件获取字节数组

  • Z时代
  • 2024-01-10
  • 分类：问答

var profileImage = fileInputInByteArray;

$.ajax({
  url: 'abc.com/',
  type: 'POST',
  dataType: 'json',
  data: {
     // Other data
     ProfileImage: profileimage
     // Other data
  },
  success: {
  }
})
// Code in WebAPI
[HttpPost]
public HttpResponseMessage UpdateProfile([FromUri]UpdateProfileModel response) {
  //...
  return response;
}
public class UpdateProfileModel {
  // ...
  public byte[] ProfileImage {get ;set; }
  // ...
}
<input type="file" id="inputFile" />

我正在使用ajax调用将输入类型的byte[]值=输入到以api[]格式接收的Webapi输入文件。但是，我遇到了获取字节数组的困难。我期望我们可以通过File API获得字节数组。

注意：在通过ajax调用之前，我需要先将字节数组存储在变量中

回答：

回答：

如上面的评论所述，尽管仍在某些UA实现中，readAsBinaryString方法尚未达到规格要求，因此不应在生产中使用。而是使用readAsArrayBuffer并遍历它buffer来获取二进制字符串：

document.querySelector('input').addEventListener('change', function() {
  var reader = new FileReader();
  reader.onload = function() {
    var arrayBuffer = this.result,
      array = new Uint8Array(arrayBuffer),
      binaryString = String.fromCharCode.apply(null, array);
    console.log(binaryString);
  }
  reader.readAsArrayBuffer(this.files[0]);
}, false);
<input type="file" />
<div id="result"></div>

对于将二进制数组转换为arrayBuffer的更可靠的方法。

回答：

是的，<input type="file"/>感谢FileReader对象及其method，文件API确实提供了一种将File中的文件转换为二进制字符串的方法readAsBinaryString。

[ ]

document.querySelector('input').addEventListener('change', function(){
    var reader = new FileReader();
    reader.onload = function(){
        var binaryString = this.result;
        document.querySelector('#result').innerHTML = binaryString;
        }
    reader.readAsBinaryString(this.files[0]);
  }, false);
<input type="file"/>
<div id="result"></div>

如果需要数组缓冲区，则可以使用readAsArrayBuffer()方法：

document.querySelector('input').addEventListener('change', function(){
    var reader = new FileReader();
    reader.onload = function(){
        var arrayBuffer = this.result;
      console.log(arrayBuffer);
        document.querySelector('#result').innerHTML = arrayBuffer + '  '+arrayBuffer.byteLength;
        }
    reader.readAsArrayBuffer(this.files[0]);
  }, false);
<input type="file"/>
<div id="result"></div>

以上是 通过输入类型=文件获取字节数组 的全部内容， 来源链接： utcz.com/qa/411823.html

回到顶部