React-Native: Convert image url to base64 string

by

I use rn-fetch-blob, basically it provides lot of file system and network functions make transferring data pretty easy.

react-native-fetch-blob is deprecated

import RNFetchBlob from "rn-fetch-blob";
const fs = RNFetchBlob.fs;
let imagePath = null;
RNFetchBlob.config({
  fileCache: true
})
  .fetch("GET", "http://www.example.com/image.png")
  // the image is now dowloaded to device's storage
  .then(resp => {
    // the image path you can use it directly with Image component
    imagePath = resp.path();
    return resp.readFile("base64");
  })
  .then(base64Data => {
    // here's base64 encoded image
    console.log(base64Data);
    // remove the file from storage
    return fs.unlink(imagePath);
  });

source Project Wiki

More Related Contents:

  1. Get image data URL in JavaScript?
  2. Using JavaScript to display a Blob
  3. How to save a base64 image to user’s disk using JavaScript?
  4. Using raw image data from ajax request for data URI
  5. JS – get image width and height from the base64 code
  6. How to parse into base64 string the binary image from response?
  7. how to compress a base64 image to custom size
  8. How to download a base64-encoded image?
  9. Get image width and height from the Base64 code in JavaScript
  10. ReadFile in Base64 Nodejs
  11. React Native – Axios – Trying to upload image
  12. How to create a translucent in React Native?
  13. How can I convert an image into Base64 string using JavaScript?
  14. How to convert file to base64 in JavaScript?
  15. Asynchronously load images with jQuery
  16. Resize image with javascript canvas (smoothly)
  17. How can I generate an apk that can run without server with react-native?
  18. Adding new data to firebase users
  19. Upload base64 image with Ajax
  20. Disable dragging an image from an HTML page
  21. How can I view network requests (for debugging) in React Native?
  22. Javascript Image Url Verify
  23. Open image in new window
  24. how to display base64 encoded pdf?
  25. Add image in pdf using jspdf
  26. What is the best way to store private data in react-native?
  27. How can I dispatch function in redux?
  28. stop dragging after a limit has reached
  29. Is there a workaround for the Firebase Query “IN” Limit to 10?
  30. FlatList renderItem is called multiple times

Leave a Comment