Instance of 'ClientException': type 'ClientException' is not a subtype of type 'JavaScriptObject' data assigned

Question

Future<void> getArticles() async {
    final QuerySnapshot querySnapshot = await collectionReference.get();
    final articles = <ArticleModel>[];

    for (final doc in querySnapshot.docs) {
      final data = doc.data() as Map<String, dynamic>;

      final downloadRef = storageRef.child('article_images/${data['dateTime']}.jpg');

      try {
        image = await downloadRef.getData();
        print('image assigned');
        print(image);
      } catch (e) {
        print(e);
      }

      final article = ArticleModel(
        dateTime: data['dateTime'],
        image: image,
        title: data['title'],
        description: data['description'],
        userId: FirebaseAuth.instance.currentUser!.uid,
        docId: doc.id,
      );
      articles.add(article);
    }

    ArticleProvider.articles = articles;
    print('data assigned');
  }

If i remove try catch for image it works fine but the problem occurs when i am trying to get image from firebase storage. Official docs also have same method but it didn't work for me....

please give me solution for this :)

I want to store my image in Uint8List from firebase storage to my article model. My article model for your reference

import 'package:flutter/foundation.dart';

class ArticleModel {
  String title;
  String description;
  Uint8List? image;
  String userId;
  String? docId;
  String dateTime;

  ArticleModel({required this.title, required this.description, this.image, required this.userId,  this.docId, required this.dateTime});

  Map<String,dynamic> toMap() {
    return {
      'title': title,
      'description': description,
      'userId': userId,
      'dateTime': dateTime,
    };
  }

  static ArticleModel fromMap(Map<String, dynamic> article) {
    return ArticleModel(title: article['title'], description: article['description'], userId: article['userId'], docId: article['docId'], dateTime: article['dateTime']);
  }

}

Answer 1

Finally, I found the solution to my issue on stack Overflow question

This typically occurs when creating a web app using Flutter due to CORS problems.

Here are some solutions I found online:

Solution 1:-

1. Go to flutter\bin\cache and remove a file named: flutter_tools.stamp
2. Go to flutter\packages\flutter_tools\lib\src\web and open the file chrome.dart.
3. Find '--disable-extensions'
4. Add '--disable-web-security'

Solution 2:- Copy this JSON to a file named cors.json:

[
    {
      "origin": ["*"],
      "responseHeader": ["Content-Type"],
      "method": ["GET", "HEAD", "DELETE"],
      "maxAgeSeconds": 3600
    }
]

I got this configuration from this webpage. refer this for full info..

Hopefully, this might be helpful to you.