React-Native：将图像网址转换为base64字符串

Question

我正在构建一个react原生应用程序，它需要以base64字符串格式存储图像，以实现离线查看功能。

什么库/函数会给我最好的结果来存储图像为Bas64字符串？假设我的网址是“http://www.example.com/image.png”。

另外，在将其存储为字符串之前，是否需要进行http请求以获取它？我的逻辑是肯定的，但在react native中，您可以在

在反应原生中做到这一点的最佳选择是什么？

Answer 1

 ImageEditor.cropImage(imageUrl, imageSize, (imageURI) => {
      ImageStore.getBase64ForTag(imageURI, (base64Data) => {
          // base64Data contains the base64string of the image
      }, (reason) => console.error(reason));
 }, (reason) => console.error(reason));

Answer 2

有一个更好的方法:安装这个react-native-fs，如果你还没有的话。

import RNFS from 'react-native-fs';

RNFS.readFile(this.state.imagePath, 'base64')
.then(res =>{
  console.log(res);
});

Answer 3

我使用rn fetch blob，基本上它提供了很多文件系统和网络功能，使得数据传输非常容易。

已弃用react-native-get ch-blob

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);
  });

源项目Wiki