I try to use firebase storage for the first time. My goal is to upload img to the storage.
Console shows this err:
"Firebase Storage: Invalid argument in
put
at index 0: Expected Blob or File.", serverResponse_: null, name_: "FirebaseError"}
export default function ImgUpload() {
const [img, setImg] = useState([]);
console.log('img', img);
const handleUpload = () => {
firebase
.storage()
.ref()
.child(`images/${img.name}`)
.put(img)
.then(function (snapshot) {
console.log('what');
});
};
return (
<div>
<Input onChange={setImg} type="file" value={img} />
<Button onClick={e => handleUpload(e)} type="submit">
Upload
</Button>
</div>
);
}
I have also find this in documentation:
var file = ... // use the Blob or File API
ref.put(file).then(function(snapshot) {
console.log('Uploaded a blob or file!'); });
I cant figure out how to set it to work even with this.
From a quick check of the ReactJS documentation on the file input tag you can get the actual file with this.fileInput.current.files[0]
.
So that'd means it'd look something like this for you:
let file = this.fileInput.current.files[0];
firebase
.storage()
.ref()
.child(`images/${file.name}`)
.put(file)
With this in the JSX:
<input type="file" ref={this.fileInput} />
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.