I’m trying to read a rather big file in chunks using FileReader (File selected from a field). Works fine on Android, Chrome, Firefox etc., but somehow on iOS Safari the FileReader stops reading the chunks exactly after 60 seconds. The error I am seeing is WebkitBlobResource error 1. Makes me wonder if this is some kind of permission error or somehow iOS Safari revokes the File blob.
Sample code:
let file = <input type="file">
let chunkSizeToUse = (1024 * 1024) // 1 MB chunks
let offset = (0 - chunkSizeToUse)
let readInterval = setInterval(() => {
if(offset < file.size){
offset += chunkSizeToUse
let fileReader = new FileReader()
fileReader.onload = () => {
let arrayBuffer = fileReader.result
//further chunk processing
}
fileReader.onerror = (err) => {
console.log(err) // WebkitBlobResource error 1 exactly after 60 seconds of processing
}
fileReader.readAsArrayBuffer(file.slice(offset, (offset + chunkSizeToUse)))
}
else{
clearInterval(readInterval)
}
}, 100)
For easier and direct debugging on an iOS device using Safari I'm gonna link this JSFiddle:
https://jsfiddle.net/L17uymvp
Just select a file and wait for the counter do go to zero.
All of this makes it impossible for some users to upload large files. Our webapp processes each chunk individually (encryption), so we have to work with chunks.