需要在 Flutter web view 中使用 src 通过 HTML 添加图片资源

Posted 2023-02-23

【中文标题】需要在 Flutter web view 中使用 src 通过 HTML 添加图片资源

【英文标题】：Need to add an image asset through HTML using src in Flutter web view

【发布时间】：2019-05-02 06:33:22

【问题描述】：

我们需要从asset文件夹中写入asset的路径还是在生成apk或ipa时保存在其他地方？尝试使用资产中的路径，但没有用。

String s="<img src="file:///asset/images/test.png"   align="right">"

我们将其用作字符串并在 web 视图中传递它，但 web 视图没有显示图像。

【问题讨论】：

为什么在 Flutter 中使用这样的 html？

好问题。我需要显示来自后端的静态内容，即使我没有连接到网络也必须显示。因此，我将来自后端的 html 内容保存到我的本地文件中。此静态屏幕包含一个图像，我需要获取存储在资产文件夹中的该图像以在 Web 视图中打开它。因此，我制作了包含来自 API 的资产和 html 内容的图像的 html 字符串，并在 Web 视图中显示。

请阅读Under what circumstances may I add “urgent” or other similar phrases to my question, in order to obtain faster answers? - 总结是这不是解决志愿者的理想方式，并且可能会适得其反。请不要将此添加到您的问题中。

@PrakharAnand 如果我理解你在 Flutter 中的构建和 html 文件是否可以放入 web 视图？为什么不在普通的 Flutter 中使用 flutter.io/docs/cookbook/images/network-image 呢？编辑：或者，如果您想这样做，只需制作 PWA？

@halfer，感谢您的建议。会调查的

【参考方案1】：

<img src=\"file:///android_asset/flutter_assets/assets  

上面的代码适用于这个包 -> flutter_inappbrowser 但我认为它只适用于android。

【讨论】：

为安卓工作。 ios 呢？

适用于 android 但无法在 iOS 中渲染图像。如果可以请帮忙！！ ***.com/questions/57702924/…

【参考方案2】：

您需要在pubspec.yaml 文件中定义您的图像，如下所示：

assets:
      - assets/your_image.png

然后你可以在代码中使用它们的路径来使用你的图像。

【讨论】：

在 yaml 中定义了这个，甚至在代码中的 ImageAsset 中使用并且正在工作，但如果我们在 html 字符串中提供 src 标签的路径，则无法获取图像。我想在 src html 标记中使用图像。请帮忙

你能指定整个 pubspec.yaml 文件吗