采用slice进行文件切割时，通过FileReader去获取每个切割元素的result报错.
1.利用slice和fileReader实现一个大文件切割的测试，思路为对input type="file"的onchange中获得的files[0]文件，按照chunkSize大小，对其进行切分采用files[0].slice(start,end)，且在切分过程中通过每次实例化一个FileReader对象，并通过监听onLoad事件，并在onLoad后去获取其对应的result,结果报错。
2.`<!Doctype>
<html>
<head>
<title>This is a test about file</title>
</head>
<body>
<input type="file" id="myfile" name="myfile" onchange="dealup()"/>
<button onclick="showresult()">Show result</button>
</body>
<script>
const chunkSize = 10;
var myresult = new Array();
function dealup() {
var file =document.getElementById("myfile").files[0];
var chunks = Math.ceil(file.size/chunkSize);
var filder = new Array(chunks);
var start = 0,end = 0;
console.log("文件总尺寸"+file.size);
for(let curindex = 0; curindex < chunks;curindex++) {
var tempcell = {
data: "",
n: 0
};
if(file.size-start <= chunkSize) {
end = file.size;
}else {
end = start + chunkSize;
}
console.log("本次切割范围:"+start + " " + end);
tempcell.n = curindex;
filder[curindex] = new FileReader();
filder[curindex].readAsText(file.slice(start,end));
filder[curindex].onload = function() {
console.log(curindex + "# ")
tempcell.data = filder[curindex].result;
myresult.push(tempcell)
}
start = end;
curindex++;
}
}
function showresult() {
console.log(myresult);
}
</script>
</html>`
3.结果报错:
茅侃侃1回答
-
偶然的你
应该是进行了两次curindex++的原因
随时随地看视频慕课网APP
相关分类
JavaScript