Flutter web canvaskit renderer not showing Network images

Question

I have A list of Images.network("$imgUrl") in my flutter app

It works fine on phones (Android and IOS even on phone Browsers) but it does not work on desktop browser. however images are shown when i use flutter build web --web-renderer html should'n it work on canvaskit renderer (which is the default renderer in my case) too?

i'm using Flutter 2.0.1 stable channel

Answer 1

If you're still looking for a workaround, changing CanvasKit to Html while running or building the project is a potential solution

flutter run -d chrome --web-renderer html
flutter build web --web-renderer canvaskit

Please have a read ->

https://flutter.dev/docs/development/tools/web-renderers

Answer 2

I need to use canvaskit. I am finding some way can fix it too.

Now, I found 2 methods.

1.

Image.network('https://cors-anywhere.herokuapp.com/' + imageUrl)

import 'dart:html';
import 'dart:ui' as UI;

String imageUrl = ".png";
  
  @override
  void initState() {
    ui.platformViewRegistry.registerViewFactory(
      imageUrl,
          (int viewId) => ImageElement()..src = imageUrl,
    );
    super.initState();
  }

  Widget showImg() {
    return SizedBox(
            width: 250,
            height: 250,
            child: HtmlElementView(viewType: imageUrl),
          );
  }

And add this below in analysis_option.yaml

analyzer:
  errors:
    undefined_prefixed_name: ignore

I think, There has some method about setting in flutter but I don't understand and have not seen any video about this.

If someone knows about this, please give the answer