Uploading picture in Firebase storage flutter dart


Asked by mighty l on November 10, 2021 (source).

I am trying to upload pictures from my gallery, the code works perfectly and is running, but not on my device. I want to know why it isn't working with me please help this is what is showing when I'm trying to run.

The selection of images is working too name and title and all that is showing if Firebase but image are not visible in storage.

enter image description here

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

    if (result != null) {
      final path = result.files.single.path;
      file = File(path!);
      setState(() => file = File(path));

  Future uploadFile() async {
    if (file == null) return;

    final fileName = basename(file!.path);
    final destination = 'Content/$fileName';

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

  Widget buildUploadStatus(UploadTask uploadTask) =>
        stream: task!.snapshotEvents,
        builder: (context, snapshot) {
          if (snapshot.hasData) {
            final snap = snapshot.data!;
            final progress = snap.bytesTransferred / snap.totalBytes;
            final percentage = (progress * 100).toStringAsFixed(2);

            return Row(
              children: [
                  '$percentage %',
                  style: GoogleFonts.asap(
                    fontSize: 17,
                    color: Colors.white,
                    fontWeight: FontWeight.w500,
          } else {
            return Container();

  State<StatefulWidget> createState() {
    // TODO: implement createState
    throw UnimplementedError();

class StatfulWidget {}

class FirebaseApi {
  static UploadTask? uploadFile(String destination, File file) {
    try {
      final ref = FirebaseStorage.instance.ref(destination);

      return ref.putFile(file);
    } on FirebaseException catch (e) {
      return null;


Question answered by Jose G (source).

That's because you're giving the database an empty value. I encountered a similar issue where I was sending the most recent message to the database and initializing it with "." Instead, use something like a space " ".

Example code: admin.firestore().collection('whatever').doc(""+id); or use ${id} surrounded with backticks `

An alternative solution could be that data needs to be in JSON format. By default, it is set to text, so it must be changed to JSON (application/json).

Here is a Github forum that is related to same issue: https://github.com/firebase/firebase-admin-node/issues/320