使用flutter将多张图片上传到firestore并获取它的下载URL并将所有URL保存到firebase

Question

我有一个要上传图像的表单，当用户尝试按下“提交”按钮时，我正在尝试将图像列表上传到 firestore 并获取其所有 URL，然后将表单提交到“x”在firebase中收集，但在上传图像并获取它的URL之前完成了“x”搭配的写作。

我认为 (async,await) 有问题。

感谢您帮助我。

List<File> imagePaths= new List() ;
List<String> imageURL= new List() ;

Future<FirebaseUser> getUser() async {
    return await _auth.currentUser();
}

Future<void> uploadPic(File _image) async {

    String fileName = basename(_image.path);
    StorageReference firebaseStorageRef = 
    FirebaseStorage.instance.ref().child(Random().nextInt(10000).toString()+fileName);
    StorageUploadTask uploadTask = firebaseStorageRef.putFile(_image);
    var downloadURL = await(await uploadTask.onComplete).ref.getDownloadURL();
    var url =downloadURL.toString();
    imageURL.add(url); // imageURL is a global list that suppose to contain images URLs
    print("\n ---------------------------\n downloadURL :"+ url);
    print("\n ---------------------------\n imageURL :"+ imageURL.toString());

  }


Submit(BuildContext context)   {
    //imagePaths is list of file 
    imagePaths.add(Front_image);
    imagePaths.add(Back_image);

    imagePaths.forEach((x)  => {
       uploadPic(x)
    });


    getUser().then((user) {

      crudObj.addNew({
        'uid': user.uid,
        'name': name,
        'images':imageURL,
      }).then((result) {
        Navigator.pop(context);

      }).catchError((e) {
        print(e);
      });
    });

  }

Answer 1

只有在上传任务完成后，您才应该调用 Submit。我建议实施这样的事情：

Stream uploadImageToFirebaseStorage(File image, String fullPath) {
  final StorageReference firebaseStorageRef =
      FirebaseStorage.instance.ref().child(fullPath);
  StorageUploadTask task = firebaseStorageRef.putFile(image);

  return task.events;
}

然后监听这个 Stream 然后才提交：

uploadImageToFirebaseStorage(
  image, 'path/imagename.jpg'
).listen((data) async {
  StorageTaskEvent event = data;
  if (data.type == StorageTaskEventType.success) {
    String downloadUrl = await event.snapshot.ref.getDownloadURL();
    await Submit(title, imageUrl: downloadUrl);
    return true;
  }
  if (data.type == StorageTaskEventType.failure) return false;
});

请注意，我没有重写你的代码，我正在分享一个可能的实现。