To get around this, I ended up just uploading the base64 as a raw string to firebaase, and when I need the data, I just initiate a fetch request, from the url returned by the firebase getDownloadURL()
method. You can also attach meta data when uploading raw. Please see below for an example:
/*
*
Retrieves the requestedbase64
*
*/
//Gets the download url of the image requested, and returned as a promise
this._imageDownloadPath.child('Imag2').getDownloadURL()
.then( (url) => {
fetch(url)
.then( (response) =>{
//return response object
return response
})
.then( (res) => {
//Sets the state to the base64 of the image requested, so it can be displayed
this.setState({img: res._bodyInit})
});
})
/*
*
Uploads the base64 to firebase as a raw string
*
*/
upload = async () => {
let result = await ImagePicker.launchImageLibraryAsync({
allowsEditing: true,
aspect: [4, 3],
base64: true
});
if (!result.cancelled) {
try{
var metadata = {
contentType: 'image/png',
customMetadata: {
'location': 'Egypt'
}
};
//Concat the image type to the base64 data
let message = 'data:image/png;base64, '+ result.base64;
//Uploads the base64 to firebase as a raw string, with the specified metadata
this._imageUploadPath.child('Imag2').putString(message,"raw",metadata).then( () => console.log("done")).catch( (err) => console.log(err) ) ;
this.setState({ images: result.uri });
}
catch(err){
console.log(err);
}