samit
samit

Reputation: 108

How to load network images on flutter web?

I made a flutter app that runs perfectly fine on Android Virtual Device but doesn't run properly when I try to run it on Edge/Chrome. Flutter is unable to load network images on web, and throws an error:

════════ Exception caught by image resource service ════════════════════════════
Failed to load network image.
Image URL: https://www.dpreview.com/files/p/articles/4059075864/images/front.jpeg
Trying to load an image from another domain? Find answers at:
https://flutter.dev/docs/development/platform-integration/web-images

And the image on Chrome looks like this:

enter image description here

So far, I have read some articles on StackOverflow and they all suggest running the HTML renderer but in my case, it didn't work. The code I use to load the image is:

Container(
  decoration: BoxDecoration(
    color: Colors.white,
    borderRadius: BorderRadius.circular(10),
  ),
  child: FadeInImage.memoryNetwork(
    placeholder: kTransparentImage,
    image:
      Data().shopItems[index]['image'].toString(),
  ),
),

How to load network images on web?

Upvotes: 0

Views: 336

Answers (1)

Chasanpro
Chasanpro

Reputation: 1

flutter run -d chrome --web-renderer html will fix the issue but looses the performanc

Upvotes: 0

Related Questions