reactjs - 通过 Firebase 将多张图片上传到 Cloud Storage

Question

我正在尝试通过 Firebase 将多张图片上传到 Cloud Storage。我正在使用 expo ImagePicker，它可以使用相机拍摄多张图像。

这是代码，

const [image, setImage] = useState([]);
const pickImageOnly = async () => {
    let result = await ImagePicker.launchCameraAsync({
      mediaTypes: ImagePicker.MediaTypeOptions.All,
      allowsEditing: true,
      quality: 0.5,
    });
    
    if (!result.cancelled) {
      setNextImg(true);
      setImage((images) => images.concat(result.uri));
    }
  };

现在，我正在尝试将这些图像存储在 firestore 数据库中。但是，数据库中只存储了一张图像，这是我的尝试。

const uploadImage = async () => {
    for (let step = 0; step < image.length; step++) {
      const uploadUri = image[step];
      let filename = uploadUri.substring(uploadUri.lastIndexOf('/') + 1);
  
      setUploading(true);
      setTransferred(0);
  
      const response = await fetch(uploadUri);
      const blob = await response.blob();
      const storageRef = firebase.storage().ref().child(`${user.email}/images/${filename}`)
      const task = storageRef.put(blob);
  
      // Set transferred state
      task.on('state_changed', (taskSnapshot) => {
        // console.log(
        //   `${taskSnapshot.bytesTransferred} transferred out of ${taskSnapshot.totalBytes}`,
        // );
    
        setTransferred(
          Math.round(taskSnapshot.bytesTransferred / taskSnapshot.totalBytes) *
          100,
        )
      })
      try {
    
        const ref = await task;
        const url = await storageRef.getDownloadURL()
        setUploading(false);
        setImage(null);
        return url;
      } catch (e) {
        console.log(e);
        return null;
      }
      
    }
  }

如何将所有图像存储在数据库中？

标签： reactjsfirebasereact-nativefirebase-storage