'How can I download multiple images from Firebase Storage on Flutter Web?

I am developing a Flutter Web application that, after clicking a download button, I need to download multiple images from Firebase Storage.

How can I don this on Flutter Web?

UPDATE:

After following Frank's suggestion on the comments, and other posts. I wrote the following function:

Future<void> downloadProductImages() async {
//TODO: modify on suppliers admin that images are saved with the correct name.
final storageRef = FirebaseStorage.instance.ref();

int count = 1;
for (final ref in product.imgsMap.keys.toList()) {
  print(ref);
  try {
    final childRef = storageRef.child(ref);
    const maxSize = 10 * 1024 * 1024;
    final Uint8List data = (await childRef.getData(maxSize))!;
    //check if file is jpeg

    late String ext;
    if (data[0] == 0xFF &&
        data[1] == 0xD8 &&
        data[data.length - 2] == 0xFF &&
        data[data.length - 1] == 0xD9) {
      ext = 'jpeg';
    } else {
      ext = 'png';
    }

    // Data for "images/island.jpg" is returned, use this as needed.
    final content = base64Encode(data!.toList());
    AnchorElement(
        href:
            "data:application/octet-stream;charset=utf-16le;base64,$content")
      //href: "image/$ext;charset=utf-16le;base64,$content")
      ..setAttribute("download", "${product.name}_$count.$ext")
      ..click();

    count++;
  } on FirebaseException catch (e) {
    //TODO: HANDLE EXCEPTIONS
    print(e);
  } on Exception catch (e) {
    // Handle any errors.
    print(e);
  }
}

// File file = // generated somewhere
// final rawData = file.readAsBytesSync();
}

On chrome mobile, the files are downloaded but are not recognized as pictures. It seems that the AnchorElment doesn't have the correct href.

Any ideas?



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source