【发布时间】：2021-11-04 20:21:37
【问题描述】：
我有一个新闻应用程序在我的手机上运行良好，但是当我尝试在网络浏览器中启动它时，它显示错误而不是图像。出现此问题是因为浏览器确保您的网页不显示来自其他页面的图像。我从 NewsApi 中获取这些图像，据我所知，它会解析新闻网站。
我尝试按照本指南进行操作：https://rodydavis.medium.com/displaying-html-in-flutter-8da44773764。却追不上。如果合并他们给出的相同代码 - 它不起作用。而且我不明白如何调整它。 我得到的错误是：
======== 图像资源服务捕获的异常 ================================= ================ 解析图像编解码器时引发了以下 ImageCodecException： 加载网络图像失败。 图片网址：https://nextbigfuture.s3.amazonaws.com/uploads/2021/09/Screen-Shot-2021-09-11-at-4.31.43-PM-1024x646.jpg 试图从另一个域加载图像？在以下位置找到答案： https://flutter.dev/docs/development/platform-integration/web-images。抛出异常时，这是堆栈： 图片提供者：NetworkImage("https://nextbigfuture.s3.amazonaws.com/uploads/2021/09/Screen-Shot-2021-09-11-at-4.31.43-PM-1024x646.jpg", scale: 1 ) 图片键：NetworkImage（“https://nextbigfuture.s3.amazonaws.com/uploads/2021/09/Screen-Shot-2021-09-11-at-4.31.43-PM-1024x646.jpg”，比例：1 ) ==================================================== ====================================================
我知道有一个用于解决此问题的文档的 URL。但是这方面的说明太小了。更详细的解决方案在我上面提供的文章 URL 中，我无法跟进。
List Image View 代码是：
ClipRRect(
borderRadius: BorderRadius.circular(9),
child: Image.network(
article.urlToImage,
key: UniqueKey(),
fit: BoxFit.cover,
width: double.infinity,
height: 200,
loadingBuilder: (BuildContext context, Widget child,
ImageChunkEvent? loadingProgress) {
if (loadingProgress == null) return child;
return Center(
child: Container(
width: double.infinity,
height: 200,
child: CircularProgressIndicator(
color: Colors.lightBlueAccent,
value: loadingProgress.expectedTotalBytes != null
? loadingProgress.cumulativeBytesLoaded /
loadingProgress.expectedTotalBytes!
: null,
),
),
);
},
),
),
GitHub 项目网址：https://github.com/dimyak06112007/news_app/tree/updates。
【问题讨论】：
-
你试过用 Image.network(url) 代替 NetworkImageProvieder 吗？
-
我只试过 Image.network(url)。我也应该尝试 NetworkImageProvider 吗？
-
@DmytroYakymenko 实际上
Network.Image(...)应该可以工作。请使用您尝试过的代码以及从中获得的确切错误来编辑您的问题。 PS：图像可以显示结果，但不能用于代码；您应该始终将代码放在格式化文本中。 -
@Mat 我编辑了我的问题。谢谢。下一步是什么？
标签： flutter flutter-web