In react-native
, converting an image to BASE64
format is easy, with a little help of react-native-fetch-blob
, I simply do:
RNFetchBlob.fs.readFile(filePath, 'base64')
.then((data) => console.log(data));
But, what about the other way around? I know there are some packages out there that does it, but I wonder if it's possible to do it with only react-native-fetch-blob
or react-native-fs
?
What I want is that after converting and saving the BASE64
image to a file, I am able to display it like this:
<Image
source={{ uri: <path/to/converted/image> }}
style={{ ... }}
/>
Turns out it's not tricky at all, suppose I have a BASE64
image, if I want to convert it to a JPG
, just use react-native-fs
like so:
import RNFS from 'react-native-fs';
const imageDate = '<some base64 data>';
const imagePath = `${RNFS.TemporaryDirectoryPath}image.jpg`;
RNFS.writeFile(imagePath, imageData, 'base64')
.then(() => console.log('Image converted to jpg and saved at ' + imagePath));
That's all
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With