[英]FileReader error parameter 1 is not of type 'Blob'
I've got a problem with a javascript Filereader which returns the error Uncaught TypeError: Failed to execute 'readAsDataURL' on 'FileReader': parameter 1 is not of type 'Blob'.我有一个 javascript Filereader 的问题,它返回错误 Uncaught TypeError: Failed to execute 'readAsDataURL' on 'FileReader': parameter 1 is not of type 'Blob'。 one in two.
二分之一。 Sometimes it works, but when i repeat the operation, it fails.
有时它有效,但是当我重复操作时,它失败了。
HTML CODE: HTML代码:
<div className="draggable-container">
<input
type="file"
id="file-browser-input"
name="file-browser-input"
ref={input => this.fileInput = input}
onDragOver={(e) => {
e.preventDefault();
e.stopPropagation();
}}
onDrop={this
.onFileLoad
.bind(this)}
onChange={this
.onFileLoad
.bind(this)}/>
JavaScript Code: JavaScript 代码:
onFileLoad(e){
const file = e.target.files[0];
let fileReader = new FileReader()
fileReader.onload = () =>{
console.log('IMAGE LOADED : ', fileReader.result)
const files = {
name: file.name,
size: file.size,
type: file.type,
data: fileReader.result,
isUploading: false
}
this.addLoadedFile(files);
}
fileReader.onabort = () =>{
alert('reading aborted');
}
fileReader.onerror = () =>{
alert('reading ERROR');
}
-> Error -> fileReader.readAsDataURL(e.target.files[0]);
} }
The drop
event contains the files in the DataTransfer object . drop
事件包含DataTransfer 对象中的文件。 So, instead of所以,而不是
const file = e.target.files[0]
you'll need to do:你需要做:
const file = e.target.files[0] || e.dataTransfer.files[0]
to handle both events.处理这两个事件。
That's probably why some of attempts worked, and some didn't - you've just uploaded the file by 2 different ways and only one was working.这可能就是为什么有些尝试成功而有些没有的原因——您刚刚通过两种不同的方式上传了文件,但只有一种可以正常工作。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.