无法使用Flutter Image Network从Firebase存储中加载图像

时间:2020-08-27 13:29:55

标签: firebase flutter google-cloud-firestore firebase-storage

我在Firestore中创建了虚拟物品清单,并将图像存储在存储中。

这是我的阅读图片表单的代码 子级:ListView.separated(

              itemBuilder: (context, int index) {
                return ListTile(
                  leading: Image.network(
                    itemNotifier.itemList[index].imageURL),
                    width: 100.0,
                    height: 100.0,
                  ),
                  title: Text('${itemNotifier.itemList[index].name}'),
                  subtitle: Text(
                    '${itemNotifier.itemList[index].description}',
                    maxLines: 2,
                  ),
                  trailing: Text(
                    '${itemNotifier.itemList[index].price.toString()}',
                  ),
                );

当我尝试查看此项目列表页面时遇到的错误如下:

════════图像资源服务捕获的异常═════════════════════════════════ ═══════════════ 抛出以下NetworkImageLoadException来解析图像编解码器: HTTP请求失败,状态代码:404,http://(db-name).appspot.com / images / pablo-downloading.png

引发异常时,这是堆栈: #0 NetworkImage._loadAsync(package:flutter / src / painting / _network_image_io.dart:95:9) #1 NetworkImage.load(package:flutter / src / painting / _network_image_io.dart:48:14) #2 ImageProvider.resolveStreamForKey。 (软件包:flutter / src / painting / image_provider.dart:501:13) #3 ImageCache.putIfAbsent(package:flutter / src / painting / image_cache.dart:359:22) ... 图片提供者:NetworkImage(“ http://(db-name).appspot.com / images / pablo-downloading.png”,比例:1.0) 图片键:NetworkImage(“ http://(db-name).appspot.com / images / pablo-downloading.png”,比例尺:1.0) ══════════════════════════════════════════════════ ══════════════════════════════════════════════════

我在这里可能想念什么?图像URL的字符串以“ gs:// ”开头是否正常?每次读写都需要编码和解码吗?

1 个答案:

答案 0 :(得分:2)

您上传到Firebase存储的每个图像都会生成两个网址

  1. 存储网址(以gs://开头)
  2. 下载网址(以https://开头)

您需要使用下载网址

要快速获取下载网址,可以参考以下代码块 StorageReference

firebaseStorageRef=FirebaseStorage.instance.ref().child('fileName');   
var url = await firebaseStorageRef.getDownloadURL();

要从Firebase Storage UI控制台获取下载链接,请单击该图像,将出现一个左对话框,然后右键单击带下划线的蓝色图像名称,然后在新选项卡中单击opean enter image description here

参考 https://stackoverflow.com/a/41767410/11330119