Styjun

Here is the url i am getting from the local phone storage

"file:///storage/emulated/0/Pictures/1548694153266.jpg"

Should i really have to convert this to base64 to upload to s3.
If so is there any good library out there to convert the local url from
react native to base64

why is it important to convert this to base64?

What is the best way to go about it.

I can easily send images from local computer through postman. from postman i can select the image directly from computer as an image object. but in this case the url is not an image object?

exports.uploadProduct = async (req, res) => 

 const uploads = await uploadMulti();

 uploads(req, res, function (err) 
 let imageFiles = req.files;
 const productImages = new Array();
 for (var i = 0; i < imageFiles.length; i++) 
 fileLocation = imageFiles[i].location;
 productImages.push(fileLocation)
 
 console.log(productImages);
 )
; 

I am using react-native-image-picker this library it gives you both base64 string and local URL it depends on you which approach best for you.

const options = 
 title: 'Select Avatar',
 storageOptions: 
 skipBackup: true,
 path: 'images'
 ,
 mediaType: 'photo',
 quality: 0.01

const pickImage = onUri => 
 ImagePicker.showImagePicker(options, response => 


 let fileName = response.fileName
 if (
 Platform.OS === 'ios' &&
 (fileName.endsWith('.heic') )

You can do this through these following steps :

Step 1: Install this package to convert it file url into base64. Here is the link for a good library to convert the local url from react native to base64

Step 2: Then in your code

import ImgToBase64 from 'react-native-image-base64';

Step 3: Make a function to convert your Image to base64

_convertImageToBaseSixFour() 

 ImgToBase64.getBase64String('YOUR_IMAGE_PATH') // path to your image from local storage
 .then((base64String) => 
 // Do your stuff with base64String
 )
 .catch(err => Alert.alert('Error' + err));

Step 4 : Call this function on a button press . You can do this accordingly.

// *** BUTTON *** //

 <View style=styles.buttonContainer>
 <Button onPress=this._convertImageToBaseSixFour title="Change to Base" color="#FFFFFF" accessibilityLabel="Tap"/> //Call on press
 </View>

// *** STYLESHEET for Button *** //

const styles = StyleSheet.create(
 container: 
 flex: 1,
 justifyContent: 'center',
 alignItems: 'center',
 backgroundColor: '#FFFFFF'
 ,
 buttonContainer: 
 backgroundColor: '#2E9298',
 borderRadius: 10,
 padding: 10,
 shadowColor: '#000000',
 shadowOffset: 
 width: 0,
 height: 3
 ,
 shadowRadius: 10,
 shadowOpacity: 0.25
 
)

Here you can find why is it important to convert this to base64