我如何将fileReader之后的图像上传到firebase存储
问题描述:
我想上传一个图像到firebase存储,必须是blob或文件,我想知道如何在使用filereader后做到这一点?我如何将fileReader之后的图像上传到firebase存储
function image(file, idOfImage){
var fr = new FileReader();
var imgCar = document.createElement('img')
imgCar.id = idOfImage
fr.onload = function() {
imgCar.src = fr.result;
}
fr.readAsDataURL(file);
document.body.append(imgCar)
}
// sometime later... I might call uploadImage() if user wants to save this image or other image...
// (I am calling image() a couple of times so multiple images on window)
function uploadImage(idOfImage){
var image = document.getElementById(idOfImage)
storage.ref('...').put(image); // I get error since not blob or file
//storage.ref('...').put(image.src); // I get same error since not blob or file
}
答
好了,所以首先您在图片功能放置文件是一个blob。所以你应该做的是让它存储在某个地方,或者只是使用你放入的任何变量作为文件参数。这样你就可以在uploadImage()
中使用它。例如:
// This is for the examples sake, but you need to save the file you give to image() somewhere (e.g. the variable below)
var imageBlob = {};
function image(file, idOfImage) {
imageBlob = file;
var fr = new FileReader();
var imgCar = document.createElement('img');
imgCar.id = idOfImage;
fr.onload = function() {
imgCar.src = fr.result;
}
fr.readAsDataURL(file);
document.body.append(imgCar)
}
// sometime later
function uploadImage() {
storage.ref('...').put(imageBlob); // I get error since not blob or file
}
如果您使用的是<input type="file">
方法上传那么你可以做function uploadImage
如下:
function uploadImage() {
// This will get the first uploaded file and upload it to firebase storage
// All files uploaded are actually blobs (it extends the blob object)
storage.ref('...').put(input.files[0]);
}
对不起,我应该更清楚。我不想总是uploadImage(),因为我希望用户选择要上传的图像,所以有时图像不需要上传。 – Rekd
好吧,让我看看我是否得到了正确的结果,用户上传图片,然后必须选择是否上传图片?正确? –
@Rekd另外,请提供更多关于应用程序如何工作的信息和更多的代码,以便我知道如何提供帮助,是吗? –