Question 35367 in React native Question posted in
The official React Native documentation can be found here.

react native firebase storage – unknown error

I’m building a react native app with firebase storage and i’m trying to 1) store the image in storage, 2) retrieve downloadURL, 3) set the downloadURL string in firebase for access via the database

storage().ref('users').child(userKey + '/profileImage').put(image.path).then(() => {
    storage().ref('users').child(userKey + '/profileImage').getDownloadURL().then(image => {
        setProfileImage(image)
        firestore().collection('users').doc(userKey).set({
            profileImage: image
        }).catch((e) => console.log('uploading image error1 => ', e));
    }).catch((e) => console.log('uploading image error2 => ', e));
}).catch((e) => console.log('uploading image error3 => ', e));

I’m getting the following error at the first storage
callenter image description here

Tags:

2

Answers


  1. 0

    What value and type is your image.path variable. If you look at the documentation for Reference.put you can see that it accepts Blob | Uint8Array | ArrayBuffer and I somewhat doubt that image.path is one of those types.

    Login or Signup to reply.
  2. 0

    image.path is reference to device storage and not contains actually image data.

    Assume that image.path is reference of image to device storage
    like file://path/to/file.

    It required to fetch image raw data either as Blob | Uint8Array | ArrayBuffer.

    For Sake of simplicity, let fetch image raw data as BLOB.

    const imgRef = firebase.storage().ref("");
// Indicate  content type extension to encode final image -JPEG,PNG
const metadata = { contentType: "image/jpg" };

const blob = await new Promise((resolve, reject) => {
  const xhr = new XMLHttpRequest();
  xhr.onload = function () {
    resolve(xhr.response);
  };
  xhr.onerror = function (e) {
    reject(new TypeError("Network request failed"));
  };
  xhr.responseType = "blob";
  xhr.open("GET", image.path, true);
  xhr.send(null);
});


// BLOB data are ready, upload to remote firebase server
imgRef.put(blob, metadata);

// We're done with the blob, close and release it
blob.close();
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search