【问题标题】:Flutter web - Failed to load network imageFlutter web - 加载网络图片失败
【发布时间】:2021-06-06 19:36:02
【问题描述】:

我的项目的 Firebase 存储桶中有图像,我想在 UI 中显示这些图像。 我按照另一个堆栈溢出答案中的说明进行操作,但它对我不起作用。

为了能够将 Firebase 存储中的图像显示在 Flutter 网页,您必须为 CORS 配置数据。

打开 GCP 控制台,选择您的项目并启动云终端 通过单击顶部导航栏中的 >_ 图标按钮进行会话。点击 打开编辑器按钮(铅笔图标),然后创建 cors.json 文件。跑步 gsutil cors set cors.json gs://your-bucket cors.json 文件应该 看起来像这样:

[{ “起源”: [”*”], “方法”:[“GET”], "maxAgeSeconds": 3600 } ] 我将原点设置为 * 这意味着每个网站都可以显示您的图像。但你也可以插入 您网站的域以限制访问。

如果您需要更多信息: https://cloud.google.com/storage/docs/configuring-cors

我在云平台上看到我的项目和存储桶的更新,但我收到相同的错误消息:

Failed to load network image.
Image URL: gs://---------------------------------.png
Trying to load an image from another domain? Find answers at:
https://flutter.dev/docs/development/platform-integration/web-image

我还按照这个人关于如何访问您的存储图像的教程进行操作。他使用了 Image.network 小部件,这也是我正在做的。它对我不起作用。下面的截图是我看到的。黑框是来自存储位置的 URL。

【问题讨论】:

  • 对我来说也有同样的问题。如果您对此有一些解决方案,请建议我。

标签: firebase flutter firebase-storage flutter-web flutter-image


【解决方案1】:

使用 HTML 渲染器

在你的终端运行它

flutter run -d chrome --web-renderer html

【讨论】:

    【解决方案2】:

    运行以下后出现图像。

    flutter build web --release --web-renderer html

    不过,我仍然无法将图像从颤振网络上传/裁剪到 firebase

    【讨论】:

    • 这意味着当你添加图像时,你必须先运行这个标签然后添加图像否则不起作用,有没有永久合适的解决方案?
    • 您需要使用图像构建应用程序。然后你运行flutter web,当你构建应用程序时,使用命令行-flutter build web --release --web-renderer html
    • 我用的是稳定版的flutter web是不是很完美?
    • 这条指令会帮助你...medium.com/flutter-community/…
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-06-05
    • 2020-07-25
    • 1970-01-01
    • 1970-01-01
    • 2021-04-15
    • 2014-08-15
    相关资源
    最近更新 更多