如何解决Javascript将FileReader转换为Int8Array ReadAsArrayBuffer
我正在尝试将图像文件转换为Int8Array。我有这样的东西:
public onFileChange(event) {
const reader = new FileReader();
reader.onload = () => {
this.productImage = new Int8Array(reader.result);
};
reader.readAsArrayBuffer(event.target.files[0]);
}
事件是上传的图像文件。 那么如何放入它:
productImage: Int8Array;
谢谢您。
解决方法
对其进行迭代
/**** Make Iterable ****/
//@arrayBuffer is the file arrayBuffer
var MakeMeIterable = function(arrayBuffer) {
this.dataview = new DataView(arrayBuffer,0);
this.size = arrayBuffer.byteLength;
this.index = 0;
}
// 1. Iterating construct like ...,for..of loop initially calls this
MakeMeIterable.prototype[Symbol.iterator] = function() {
// 2. Afterwards iterating construct utilises this object only for getting further values
return {
dataview: this.dataview,size: this.size,index: this.index,current: this.from,last: this.to,// 3. next() is called on each iteration by the other iterating constructs like ...,for..of loop
next() {
// 4. it should return the value as an object {done:..,value :...}
if (this.index < this.size) {
var result = this.dataview.getInt8(this.index);
this.index += 1;
return {
done: false,value: result
};
} else {
return {
done: true
};
}
}
};
};
/**********************/
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="input" type="file"></input>
<script>
function readFile(f) {
var reader = new FileReader();
reader.onload = function() {
var cursor = new MakeMeIterable(reader.result);
this.productImage = cursor; //cursor <--iterable!
/*
//uncomment to have some fun in console
for (let num of cursor) {
console.log(num);
}
*/
};
reader.onerror = function(e) {
alert('Some error!');
console.log("Error:",e);
};
reader.readAsArrayBuffer(f);
}
$(function() {
$('#input').on("change",function(e) {
var file = e.currentTarget.files[0];
readFile(file);
});
});
</script>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。