Upload Image - Firebase example for Flutter web

main.dart

import 'dart:html' as html;
 
import 'package:mime_type/mime_type.dart';
import 'package:path/path.dart' as Path;
import 'package:image_picker_web/image_picker_web.dart';
import 'package:firebase/firebase.dart' as fb;
import 'package:flutter/material.dart';
 
 html.File _cloudFile;
 var _fileBytes;
 
 Future<void> addImage() async {
    var mediaData = await ImagePickerWeb.getImageInfo;
    String mimeType = mime(Path.basename(mediaData.fileName));
    html.File mediaFile =
        new html.File(mediaData.data, mediaData.fileName, {'type': mimeType});

    if (mediaFile != null) {
      setState(() {
        _cloudFile = mediaFile;
        _fileBytes = mediaData.data;
      });
    }
  }

  uploadImage(BuildContext ctx) async {
  try {
          /// Upload Image file to firebase
          fb.UploadMetadata meta = new fb.UploadMetadata(
              contentType: mime(Path.basename(_cloudFile.name)));

          fb.StorageReference storageReference = fb
              .storage()
              .ref('[PARENTSNAPSHOTID]')
              .child('${_cloudFile.name}');

          fb.UploadTask uploadTask = storageReference.put(_fileBytes, meta);

          var snapshot = await uploadTask.future;
          String fileURL = (await snapshot.ref.getDownloadURL()).toString();

          /// Use fileURL to save in Firebase document or show the uploaded file
      
      Scaffold.of(ctx).showSnackBar(SnackBar(
        content: ListTile(
          leading: Icon(Icons.cloud_done, color: Colors.green.shade500),
          title: Text('Image successfully published to Firebase'),
        ),
        action: SnackBarAction(
            label: 'OK',
            onPressed: () => Scaffold.of(ctx).hideCurrentSnackBar()),
      ));
    } catch (e) {
      debugPrint(e.toString());
    }
  }