Firebase Storage上传图片报错TypeError: Network request failed求助

我尝试使用以下代码将图片上传至Firebase Storage：

async function uploadData() {
  console.log('good job')
  const randomName = Math.random().toString(36)
  const uri = image;

  setUploading(true)
   console.log(image)
  
  const childPath = firebase.storage().ref().child('drivers').child('truck').child(randomName)
  const response = await fetch(image)
  const blob = await response.blob()
  const task = childPath.put(blob, { contentType: 'image/jpeg'})

  const taskProgress = snapshot => {
    //setUploading = true
    console.log('transferred: ', snapshot )
  }
  const taskCompleted = () => {
   task.snapshot.ref.getDownloadURL().then((snapshot) => {

    saveToFireStore(snapshot)
      console.log(snapshot)
    })
  }
  const taskError = snapshot => {
   // setUploading(false)
    Alert.alert(
      "",
      snapshot,
      [
        
        { text: "OK", onPress: () => setUploading(false) }
      ])
    console.log(snapshot)
  }
  task.on("state_changed", taskProgress, taskError, taskCompleted)
}

运行时返回错误TypeError: Network request failed，已排除网络连接问题，推测是代码或Firebase更新导致的问题，需要排查帮助。

• 检查image变量的格式：
  如果是React Native环境，本地图片URI通常以file://开头，直接用fetch会触发权限或跨域问题。可以去掉前缀后用RN专用工具处理：

  // React Native环境下适配本地URI
  const uri = image.replace('file://', '');
  const blob = await RNFetchBlob.fs.readFile(uri, 'base64').then(data => {
    return Blob.build(data, { type: 'image/jpeg;' });
  });
  

  如果是Web环境，确认image是有效的Blob/File对象或可公开访问的HTTP URL。

• 验证Firebase Storage权限规则：
  默认规则仅允许认证用户上传，若未配置认证或测试需求，可临时调整规则（上线前务必改回严格规则）：

  rules_version = '2';
  service firebase.storage {
    match /b/{bucket}/o {
      match /{allPaths=**} {
        allow read, write: if request.auth != null;
        // 测试用临时规则：allow read, write: if true;
      }
    }
  }
  

• 添加fetch环节的错误捕获：
  在fetch和blob()调用处增加异常捕获，定位具体失败环节：

  try {
    const response = await fetch(image);
    if (!response.ok) throw new Error(`HTTP错误：${response.status}`);
    const blob = await response.blob();
  } catch (err) {
    console.error('Blob获取失败：', err);
    setUploading(false);
    return;
  }
  

• 检查Firebase SDK版本兼容性：
  避免使用测试版SDK，尝试更新到最新稳定版：

  npm install firebase@latest --save
  

• 优化错误回调的信息展示：
  taskError接收的是错误对象，直接传入弹窗会显示对象结构，需提取具体错误信息：

  const taskError = (error) => {
    setUploading(false);
    const errorMsg = error.message || '上传失败';
    Alert.alert('错误', errorMsg, [{ text: "OK" }]);
    console.error('上传错误详情：', error);
  }
  

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