Question

我要将b64转换为blob in react native。

但我在atob功能上遇到错误。

这是我的代码。

var binary = atob(this.state.avatarSource.uri.split(',')[1]);
var byteNumbers = new Array(binary.length);

for(var i = 0; i < binary.length; i++) {
  byteNumbers.push(binary.charCodeAt(i));
}
var file = new Blob([new Uint8Array(byteNumbers)], {type: 'image/jpeg'});

有人有任何想法吗？

Answer 1

请勿使用atob或btoa，仅适用于Debug Mode。

因为当您使用调试模式时，您在浏览器中运行JS代码（应该是V8），而如果您要在生产模式下运行应用程序，它会使用JavascriptCore没有atob或btoa实施。

您可以使用base-64将数据转换为BASE64编码的字符串，但我不确定它是否可以为您创建正确的Blob对象。

根据我的理解，Blob是JS上下文和文件系统之间的桥梁，React Native本身还没有文件系统API，因此你可能得到一个Blob对象，但它总是空的。

如果你要从包含数字的数组创建一个图像，你可以查看react-native-fetch-blob这是我正在研究的项目，希望它可以解决这类问题:)

Answer 2

我正在获得图像的基础64。之后我将从下面的代码中显示它。希望它可以帮到你

let imgSrc = "data:image/png;base64," + base64ImageData;
<Image source={{uri: imgSrc, scale: 1}} style={{ height: 80, width: 80}}/>

Answer 3

你可以试试fetch

  let blob = await this.base64ToBlob(encoded);
  console.log('btoB64 resp === ', blob);

  async base64ToBlob(encoded) {
    let url = `data:image/jpg;base64,${encoded}`;
    let res = await fetch(url);
    let blob = await res?.blob();
    return blob;
  }

如何在React Native中将base64转换为Blob？

3 个答案: