0

I am new to flutter and I builtt an application for the web where contractors will use it to take photos of their work and upload them so our team can review them. Currently, I have it going into fire storage. They type in their work order number then can access gallery or photo and select it and hit upload and it goes to firestorage.

I want to build another page where our team can type in the work order number and it pulls all photos. I store them in FBS with path = '$workOrder/$dateTime'; I know you cant really use firebase storage for that and its best to run a query for all the URLs for the images in a database.

I can't find much on using firestore to grab photos.

but I'm a beginner and looking to learn any advice on how to approach this would be appreciated.

(i know its better to just do ios or android but I want to do flutter web)

below is how I am uploading it to FB

Future<PickedFile> pickImage() async {
    try {
      return await ImagePicker().getImage(source: ImageSource.gallery, imageQuality: 10);

    } catch (error) {
      print('error loading image : $error');
      return null;
    }
  }


  uploadPhotos(PickedFile pickedFile) async {
    final dateTime = DateTime.now();
    final workOrder = double.parse(workOrderNumber.value.text);
    final path = '$workOrder/$dateTime';
    var fileByte = await pickedFile.readAsBytes();

   setState(() {
     _uploadTask = fb
         .storage()
         .refFromURL('****')
         .child(path)
         .put(fileByte, fb.UploadMetadata(contentType: 'image/png'));
   });
bay
  • 53
  • 1
  • 4

2 Answers2

1

Usually for similar task, I get the downloadURL after image upload and store it in the respective order's firestore document; And whenever a request happens for the order, retrieve the image download urls from the firestore document and download the image files from Firebase Storage.

Ref: https://firebase.flutter.dev/docs/storage/usage/

If you store them in FBS with path = $workOrder/$dateTime, whenever an user search for an order, you have to get all the images within the $workOrder storage folder, if i am not wrong!

Ref: How to get a list of all files in Cloud Storage in a Firebase app?

Muthu Thavamani
  • 1,325
  • 9
  • 19
0

One approach is while uploading the image to the firebase storage, it will give you the downloadUrl to the image/file. Store that donwloadUrl in the database like firestore. And you can use that downloadUrl later to access the uploaded image/file.

Another approach would be, you can get the downloadUrl to all of the uploaded images/files in the firebase storage and later do the operations on them.

You can get the downloadUrl to the already uploaded images/files using following code snippet:

final result = await FirebaseStorage.instance.ref().listAll();

result.items.forEach((Reference ref) {
  ref.getDownloadURL().then((value) {
    print(value); // value variable will have the link to the file in firebase storage
  });
});
Ankush Chavan
  • 1,043
  • 1
  • 6
  • 20