Flutter Web: Images uploaded to firebase storage not showing preview

Viewed 261

I am migrating one of my apps to the web with flutter for the first time. My app uses firebase packages to post images to firebase storage. We know "file path" doesn't work on the web so I had to change to byte. But on the firebase storage, I discovered that the images posted through bytes cannot be previewed. If you click on the token, rather than a preview, it will just download straight away.

Here is a pictorial illustration of what I mean: Images, when clicked are supposed to be able to show a preview like this Immmm But this is what I get enter image description here I see they are uploaded as documents instead of file.

Please how do I rectify this. This is my code below

  Future selectFile() async {
    final result = await FilePicker.platform.pickFiles(allowMultiple: false, type: FileType.image);

    if (result == null) return;
    final path = result.files.single;

    setState(() => imageFile = path);
  }

//upload

Future  upload() async {
  if (imageFile == null) return;

                    final fileName = imageFile!.name;
                    final destination = 'FTV/Thumbnails/$fileName';

                    // task = FirebaseApi.uploadFile(destination, file!);
                    task = FirebaseApi.uploadBytes(destination, fileBytes!);
                    setState(() {});
                    

                    if (task == null) return;

                    final snapshot = await task!.whenComplete(() {});
                    var urlDownload = await snapshot.ref.getDownloadURL();

                    // print('Download-Link: $urlDownload');
                    setState(() {
                      imageURL = urlDownload;
                    });
}
0 Answers
Related