React Native - Firebase Storage upload using Expo

I am trying to upload an image using Expo ImagePicker to Firebase Storage. Since Expo does not support Blob yet, thus, I cannot use react-native-fetch-blob and I do not wish to detach from Expo, I decided to try the following solution:

Following the Firebase upload documentation I decided to convert the image picked with ImagePicker to base64 and then upload it to Firebase.

_pickImage = async () => {
    let result = await ImagePicker.launchImageLibraryAsync({
        base64: true,
        allowsEditing: true,
        aspect: [4, 3]
    });

    console.log(result);

    if (!result.cancelled) {
        this.setState({ image: result.uri });

        var storageRef = firebase.storage().ref();
        var imageRef = storageRef.child("images/avatar.png")

        imageRef.putString(result.base64).then(() => console.log("Image uploaded successfully.")).catch((err) => console.log(err));
    }
};

However, the code above produces the following error:

I am now stuck and cannot figure out how to properly upload a file to Firebase storage. Is anyone who is using Firebase and Expo able to suggest an alternative, up-to-date way to do so?

P.S. I do not want to switch databases. I have been suggested to use AWS React Native file upload. But I want to stick with Firebase.

This topic was automatically closed 15 days after the last reply. New replies are no longer allowed.

this might be useful to you: https://github.com/expo/firebase-storage-upload-example

1 Like