[英]Uploading an image to Firebase with React-Native
I'm using this method to try upload image to Firebase with my React-Native app because it seems to be a very common example on the internet, However I think it is quite old and I suspect that it no longer works on newer versions of React-Native. 我正在使用此方法尝试通过我的React-Native应用程序将图像上传到Firebase,因为这似乎是互联网上非常普遍的示例,但是我认为它已经很老了,我怀疑它不再适用于更新版本的React-Native。
Can someone please show me the correct way to save images in Firebase storage, thank you! 有人可以告诉我将图像保存在Firebase存储中的正确方法,谢谢!
const uploadImage = (uri, imageName, mime = 'image/jpg') => {
return new Promise((resolve, reject) => {
const uploadUri = Platform.OS === 'ios' ? uri.replace('file://', '')
: uri;
let uploadBlob = null
const imageRef = firebase.storage().ref('images/').child(imageName)
fs.readFile(uploadUri, 'base64')
.then((data) => {
return Blob.build(data, {type: `${mime};BASE64`})
})
.then((blob) => {
uploadBlob = blob
return imageRef.put(blob, {contentType: mime})
})
.then(() => {
uploadBlob.close()
return imageRef.getDownloadURL()
})
.then((url) => {
resolve(url)
})
.catch((error) =>{reject(error)})
})
}
You can just use the putFile method. 您可以只使用putFile方法。
Here is my FirebaseStorageService with saveImage method (I'm using RN 0.53 and react-native-firebase 4.1.0): 这是我的带有saveImage方法的FirebaseStorageService(我正在使用RN 0.53和react-native-firebase 4.1.0):
saveImage(ref, image, imageName, onSuccess, onError){
LOG.debug("FirebaseStorageService :: saveImage ", {ref:ref, image:image, imageName:imageName});
var firebaseStorageRef = firebase.storage().ref(ref);
const imageRef = firebaseStorageRef.child(imageName + ".jpeg");
LOG.debug("FirebaseStorageService :: imageRef ", {imageRef:imageRef});
imageRef.putFile(image.path, {contentType: 'image/jpeg'}).then(function(){
return imageRef.getDownloadURL();
}).then(function(url){
LOG.debug("Image url", {url:url});
onSuccess(url);
}).catch(function(error){
LOG.error("Error while saving the image.. ", error);
onError(error);
});
}
The image is the one returned by react-native-image-crop-picker . 该图像是由react-native-image-crop-picker返回的图像 。 User can choose between open camera and open gallery and it returns an image object.
用户可以在打开的相机和打开的画廊之间进行选择,它返回一个图像对象。
The path property of the image object is just a string like "file://.." for Android and "/Users/..." for iOS. 图像对象的path属性只是一个字符串,例如对于Android来说是“ file:// ..”,对于iOS来说是诸如“ / Users / ...”。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.