Rn-fetch-blob: Issue to load a image blob for firebase

[Kevinmenar]

Hi my name is Kevin, and I am having a issue when I try to convert a uri to a blob.

I actually I am using the version 0.55 of react native and 0.10.12 of the library and this is my code

` uploadImage = (mime = 'image/jpeg', name) => {
const Blob = RNFetchBlob.polyfill.Blob;
const fs = RNFetchBlob.fs;
window.XMLHttpRequest = RNFetchBlob.polyfill.XMLHttpRequest;
window.Blob = Blob;
var uri = this.props.image;

return new Promise((resolve, reject) => {
  let imgUri = uri; let uploadBlob = null;
  const uploadUri = Platform.OS === 'ios' ? imgUri.replace('file://', '') : imgUri;
  const { currentUser } = auth;
  const imageRef = storage.ref(`/images/${currentUser.uid}`)

  fs.readFile(uploadUri, 'base64')
    .then(data => {
      return Blob.build(data, { type: `${mime};BASE64` });
    })
    .then(blob => {
      uploadBlob = blob;
      return imageRef.put(blob, { contentType: mime, name: name });
    })
    .then(() => {
      uploadBlob.close()
      return imageRef.getDownloadURL();
    })
    .then(url => {
      resolve(url);
    })
    .catch(error => {
      reject(error)
  })
})

}`

When I run this line window.Blob = Blob; I am getting this error

I read this issue in react-native-fetch-blob, but this does not have any solution

Thanks to read my problem and thanks for your work

[sertony]

@Kevinmenar having the same issue. Have you resolved it somehow?

[Kevinmenar]

Hi @sertony! This is a problem with react-native no with rn-fetch-blob. You need to avoid the yellow box alert with this code

console.disableYellowBox = true;

You can add this code on app.js or index.js

[sertony]

@Kevinmenar thanks! Unfortunately didn't work for me 😕

[ManalLiaquat]

@sertony
Maybe it helps you
See this gist

[sertony]

@ManalLiaquat got an idea, thanks! It probably works!

I have already switched to react-native-firebase which allows me to upload directly to the storage just passing the image uri as a parameter.

[ManalLiaquat]

@sertony That's great, for later projects, you can read _this article_ as an extra source.

And can you tell me how to configure expo app in react-native-firebase?

[sertony]

@ManalLiaquat I'd be glad to help, but I don't use expo in my projects.

[ManalLiaquat]

@sertony oh okay 😐. Thanks, Mate✌

[lylest]

facing the same problem somebody to help please

[withewolf-dev]

@ManalLiaquat got an idea, thanks! It probably works!

I have already switched to react-native-firebase which allows me to upload directly to the storage just passing the image uri as a parameter.

can you please show an example code snippet, cause I'm using RNfbs but not being able to upload file