Horia-Andrei CIULICA
Horia-Andrei CIULICA

Reputation: 27

Error uploading image to firebase storage in React Native [ Firebase 9.6.2]

so i'm trying to upload an image to firebase storage (a local photo from the source file directory - path: same path as .js). The problem is that in firebase storage the image appears to be corrupted and every picture have 9 bytes firebase storage image . The authentication and firestore works perfectly, this is my configuration file: firebase config file and this is the code:

const uploadPhoto = async() => {
    // console.log(image);
    // const uploadUri = image;
    // let filename = uploadUri.substring(uploadUri.lastIndexOf('/') + 1);
     
    const metadata = {
      //path: '../../firebase_image.jpg',
      contentType: 'image/jpeg'
    };
    const photog = `./photo.jpg`;
    console.log(photog);
    console.log(uploadUri);
    const storageRef;
    storageRef=ref(storage, 'photogra.jpg');//filename+
    uploadBytes(storageRef, photog, metadata).then((snapshot) => {
      console.log('Uploaded a blob or file!');
    });
   
  }

Upvotes: 1

Views: 906

Answers (2)

Zaithel Cardoza
Zaithel Cardoza

Reputation: 46

I got the information from this amazing tutorial and worked fine for me https://www.youtube.com/watch?v=H-yXO46WDak&lc=z22ph5dhssfqufkcxacdp430segloszlmvuqlp1seplw03c010c

Try with this:

const uploadImageFirebase = async () =>{

  const nameImage =  new Date().toISOString();
  
  const img = await fetch(image);
  const bytes = await img.blob();

  try {
    await uploadBytes(ref_con, bytes); 

    } catch (error) {
    console.log(error);
    } finally {
      //
    }        
};

Upvotes: 3

Frank van Puffelen
Frank van Puffelen

Reputation: 598817

If you check the contents of your 9-byte file, it'll like be "photo.jpg".

Since you're passing "photo.jpg" to uploadBytes, it uploads that strings as the contents of the new file. It does not know how to load the file at that path.

You will either need to pass a local File or Buffer (which you'll usually get from a file picker or something like that), or load the data from the file yourself and pass the contents to uploadBytes.

Upvotes: 0

Related Questions