时间戳

首页 > 解决方案 > 无法将 react-native-camera TakePictureResponse 上传到 Firebase 存储

typescript - 无法将 react-native-camera TakePictureResponse 上传到 Firebase 存储

问题描述

我正在尝试使用 react-native-camera 拍照，然后将该照片上传到 Firebase 存储。我可以使用 RNFetchBlob 将文件作为 blob 检索，但是当尝试将 .put() 放入 Firebase 存储时，我得到一个

Firebase 存储：put索引 0 处的参数无效：预期的 Blob 或文件。

我也尝试使用.putString()并将其作为 base64 字符串传递，或者只是 uri，但是我遇到了类似的问题。这是一些相关的代码。

export function createPhoto(photo: TakePictureResponse): Boolean {
  var ref = storage.ref();
  var photoRef = ref.child('photos');
  if (Platform.OS === 'ios') {
    var filePath = photo.uri.replace('file:', '');
  } else {
    filePath = photo.uri.split('raw%3A')[1].replace(/\%2F/gm, '/');
  }
  RNFetchBlob.fs.readFile(filePath, 'base64').then((data) => {
    photoRef.put(data).then((snapshot) => {
      console.log('Uploaded a photo');
      console.log(snapshot.downloadURL);
    });
  });

更新：RNFetchBlob.fs.readFile() 根据您选择的解码器选项返回一个字符串（对于本示例，它是 base64）。但是我仍然有问题，因为 Firebase 存储将不接受带有 .putString(data, 'base64') 的 base64 字符串。我得到一个"Firebase Storage: String does not match format 'base64': Invalid character found"错误。

标签： typescriptfirebasereact-nativefirebase-storage

解决方案

由于我使用的是 React Native，我遇到问题的原因已在此处的另一篇文章中得到解答。https://stackoverflow.com/a/52174058/7842007

它基本上与 react native 无法处理 firebase 存储使用的 atob 和 btoa 有关，因此您必须使用诸如“encode-64”之类的库或通过创建自己的库。

推荐阅读