samedi 6 mars 2021

Unable to load network image of a YouTube thumbnail Flutter Web

I am trying to implement the Youtube Plyr IFrame plugin in my latest Flutter project( https://pub.dev/packages/youtube_plyr_iframe). Everything works expect I am unable to fetch the video thumbnail from the website source (https://i3.ytimg.com/vi/TyimCGEkiUc/maxresdefault.jpg). I've narrowed the problem down to the Image.network constructor. I am able to load other images with this widget but whenever it comes to a YouTube thumbnail it gives me this error:

════════ Exception caught by image resource service ════════════════════════════
The following ImageCodecException was thrown resolving an image codec:
Failed to load network image.
Image URL: https://i3.ytimg.com/vi/TyimCGEkiUc/maxresdefault.jpg
Trying to load an image from another domain? Find answers at:
https://flutter.dev/docs/development/platform-integration/web-images

When the exception was thrown, this was the stack
Image provider: NetworkImage("https://i3.ytimg.com/vi/TyimCGEkiUc/maxresdefault.jpg", scale: 1)
Image key: NetworkImage("https://i3.ytimg.com/vi/TyimCGEkiUc/maxresdefault.jpg", scale: 1)
════════════════════════════════════════════════════════════════════════════════

I am not sure what to make of this. The odd thing is that the example page featured in the Flutter package works fine, see here (https://jonatadashi.github.io/Web-Example/#/). If my problem wasn't frustrating enough I messed with the Interactive example on flutter.dev putting my link into the existing code and it worked completely fine (https://flutter.dev/docs/cookbook/images/network-image). The Youtube Plyr IFrame package does not require any API and I am able to pull the image successfully in a basic html file.

My Code:

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Image.network(
            'https://i3.ytimg.com/vi/TyimCGEkiUc/maxresdefault.jpg'),
      ),
    );
  }
}

Here is an image url that works with my code: https://picsum.photos/250?image=9




Aucun commentaire:

Enregistrer un commentaire