React Native Javascript uploading files using blob or base64 instead of uri

Question

I am currently uploading images.

If I use this method it works:

formData.append("file",{uri,type,name});

However, I don't want to use the image URI to send my image. Because I want to chunk the image into separate parts, how can I send a blob instead of URI? Or maybe base64.

Check this https://stackoverflow.com/questions/6150289/how-to-convert-image-into-base64-string-using-javascript/20285053#20285053 — Shubham Khatri, Feb 16 '18 at 06:39
What do you mean by “image URL”? An URL on another server or a data URL? If it’s a data URL, it is already base64 encoded binary data. https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URIs — Shuhei Kagawa, Feb 16 '18 at 06:42

score 0 · Answer 1 · answered Feb 16 '18 at 08:19

You can convert image into base64 using the code below

import {Image,ImageStore,ImageEditor} from 'react-native';

const imageURL = response.uri; //path for the image
        Image.getSize(imageURL, (width, height) => {
          var imageSize = {
            size: {
              width,
              height
            },
            offset: {
              x: 0,
              y: 0,
            },
          };
          ImageEditor.cropImage(imageURL, imageSize, (imageURI) => {
            console.warn(imageURI);
            ImageStore.getBase64ForTag(imageURI, (base64Data) => {
              this.setState({ pictureBase64: base64Data });
              console.warn("Base", base64Data) //Converted base64 image
              ImageStore.removeImageForTag(imageURI);
            }, (reason) => console.warn(reason))
          }, (reason) => console.warn(reason))
        }, (reason) => console.warn(reason))
      }
    });

React Native Javascript uploading files using blob or base64 instead of uri

1 Answers1