Expo React Native中Firebase图片上传：put替代putFile报错求助

嗨，我来帮你搞定这个问题～

你遇到的核心问题是：RNFirebase的putFile是专门为React Native优化的封装方法，能直接识别本地图片URI，但标准Firebase SDK的put方法不支持直接传RN的本地URI，它要求传入二进制数据（Blob、File或ArrayBuffer类型），所以直接传URI才会报[object object]的错误。

下面是具体的修复步骤：

1. 先把本地URI转换成Blob对象 #

写一个异步函数，用Fetch API把URI对应的文件转换成Blob：

const uriToBlob = async (uri) => {
  // 通过fetch获取URI对应的文件资源
  const response = await fetch(uri);
  // 将响应转换为Blob类型
  const blob = await response.blob();
  return blob;
};

2. 修改上传代码，使用Blob上传 #

在你的上传逻辑里，先调用上面的函数把URI转成Blob，再传给put方法：

// 确保这段代码在异步函数中执行（比如带async标记的方法里）
try {
  // 转换URI为Blob
  const imageBlob = await uriToBlob(postImage.uri);
  
  // 上传到Firebase Storage
  const uploadResponse = await firebase.storage()
    .ref()
    .child(`posts/${fileName}`)
    .put(imageBlob);
  
  console.log('Put file response :', uploadResponse);
  
  // 上传完成后记得关闭Blob，避免内存泄漏
  imageBlob.close();
} catch (error) {
  console.error('上传失败:', error);
}

3. 可选：指定文件元数据（推荐） #

如果需要让Firebase正确识别文件类型（比如图片的MIME类型），可以在上传时传入元数据：

const metadata = {
  contentType: 'image/jpeg', // 根据你的图片类型调整，比如image/png
};

// 上传时带上metadata
const uploadResponse = await firebase.storage()
  .ref()
  .child(`posts/${fileName}`)
  .put(imageBlob, metadata);

这样修改后，就能正常用标准Firebase SDK的put方法上传图片啦～

内容的提问来源于stack exchange，提问作者Happy Smile